代码改变世界

ie6 float bug

2010-09-10 14:35  爱研究源码的javaer  阅读(977)  评论(0编辑  收藏  举报
   针对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问题了!

转自:http://www.kejiweb.com/HTMLjiaocheng/csshack_18697.html