IE6的float 的问题解决

huangyunbin

针对IE6 对 float 元素显示不正常的问题

测试了很多次，发现跟 margin 和 padding 没有直接的关系，本质的问题根源在于，包含 float 元素的外层 div，没有设置足够的宽度和高度，也就是说，这个容器没有足够的空间用来显示内部所有的 float 元素。

margin 和 padding 只是一个间接原因，如果没有内外边距，可能外层 div 刚好可以容纳内部的 float。

加上边距后，每个 float 占用的空间就变大了，首先带来的问题是 div 的宽度不够，那么，愚蠢的 IE6 就会产生莫名其妙的问题，反映给用户的现象就是出现鬼影。

解决方案一：准确计算内部 float 元素加在一起占用的宽高，确保外层 div 在 css 中明确指定了具体的 width 和 height 像素值，问题不会再出现。

解决方案二：给浮动的div加上两个语句  1、浮动的div 设置display:inline  2、浮动的div 加overflow:hidden

这样就能解决ie6 下的flaot问题了！

考虑到兼容火狐等，可以用!important标记