Tag: CSS
著名的IE6 double margin bug
by hustcom on Dec.16, 2008, under webdev
同样在IE5和IE5.5上也能重现的bug,就是到一个元素float方向和margin方向相同的时候,margin会加倍。
比如一下元素:
<div class”left” />
它的样式:
.left
{
float: left;
margin-left: 10px;
}
在IE6下,你会发现这个margin其实占据了20px。
原因就是这是浏览器的bug,解决方案也很多,我这里举几条:
- 加”display:inline”的style: 在元素float后,display属性随之无效,所以你可以大胆地加上这个属性;
- 绕道行之:换用padding,或调换父级子级间距关系等方式避免正面遇到这个bug;
- CSS hack:不推荐,不告知。
