IE6 float:left margin

2021-03-10 19:34 jianzhan
在IE6下(规范方式/奇异方式)
1个元素向左波动(float:left),且加上了向左空白边(margin-left:10px),那末会全自动的加1倍变为30px。
例:

拷贝编码
编码以下:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf⑻">
<title>IE6双空白边Bug</title>
</head>
<body>
<div style="border:1px solid red;width:200px;">
<div id="d1" style="margin:0 0 0 10px;float:left;border:1px solid gray;">
IE6双空白边bug
</div>
<div style="clear:both;"></div>
</div>
</body>
</html>

处理方式
给div[id=d1]加:display:inline,自然只对于IE61下,可使用下划线加特性-display:inline,这样仅有IE6能鉴别了。
边距翻倍仅有当元素的边距碰到包括块时才产生。当1个元素被波动到另外一个波动元素时不容易翻倍。另marginTop和marginBottom都不容易翻倍。