ie6下 float bug

2013-02-20阅读(3201)评论(0)牵着狗狗看MM

苏州实时公交查询

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

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

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

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

解决方案二:给浮动的div加上两个语句

 display:inline;overflow:hidden;

这里推荐用方案二
这样就能解决ie6 下的flaot问题了!

赞(0)
转载请注明来源:Web前端(W3Cways.com) - Web前端学习之路 » ie6下 float bug
分享到: 更多 (0)