在IE6下(標(biāo)準(zhǔn)模式/怪異模式)
一個(gè)元素向左浮動(dòng)(float:left),且添加了向左空白邊(margin-left:10px),那么會(huì)自動(dòng)的加一倍變成30px。
例:
<!DOCTYPE HTML>
<html>
<head>
<meta charset=”utf-8″>
<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,當(dāng)然只針對(duì)IE6一下,可以使用下劃線加屬性-display:inline,這樣只有IE6能識(shí)別了。
邊距翻倍只有當(dāng)元素的邊距碰到包含塊時(shí)才發(fā)生。當(dāng)一個(gè)元素被浮動(dòng)到另一個(gè)浮動(dòng)元素時(shí)不會(huì)翻倍。另marginTop和marginBottom都不會(huì)翻倍。
新聞熱點(diǎn)
疑難解答
圖片精選