2010-10-22 13:57:13| 分类: 计算机与 Interne | 标签: |举报 |字号大中小 订阅
在使用IE6.0及IE5.5或更以前版本浏览页面时,有时会发现栏目与栏目之间的边距会非常大,造成页面变形。尤其是现在DIV+CSS为页面设计的主流后,这个问题更是明显突出。
在这里举一个例子,这是一段正确的代码:
我们希望得到的结果是,一个简单的div(墨色的盒子)包含着一个居左浮动的div(粉色的盒子)。粉色的盒子距墨色的盒子有一个100px的左边界。
如图: IE7 IE8的效果
但在IE6的效果却是这样,100px的间隙变成了200px。
这是由于我们同时使用了float和margin,其实这是IE6.0的一个双倍浮动边界Bug(float margin),在IE7.0即以上版本中已经不存在这个问题。
如何解决IE6.0边距双倍的问题?
这时我们给粉色的盒子的CSS样式多加一个(display: inline;)参数即可解决这个问题。
修改CSS代码如下:
参考博文:
http://hi.baidu.com/383215209/blog/item/ff88181fc58e08fc1bd5768c.html
相关教程:
经验之谈-超级牛最详细的Div+CSS布局案例
DIV+CSS如何居中,上下左右,三列DIV等多种布局案例
评论