IE BUG，margin 两倍

<style>
#div_1 {
 background: #F00;
 overflow: auto;
 zoom: 1;
}
#div_2 {
 float: left;
 width: 100px;
 height: 100px;
 margin-left:100px;
 background: #FF0;
 /* display: inline;  */
}
</style>
<div id="div_1">
   <div id="div_2"></div>
</div>

触发条件：

1、父元素包含子元素
2、子元素设置了浮动（float）
3、子元素设置了外边距（margin）
4、浮动方向和边距方向一致

解决方法：

IE6下看，#div_2的左边距会变成200PX，解决方法就是给#div_2加上display: inline;

站长itlearner注：有些人会担心，加了display:inline会不会对页面有其它影响。一般来说不会有影响，可以放心的加上。因为当float时，display会自动设置为block的，而不管原先的设置，display:none除外。

• 转载请注明来源：IT学习者 网址：http://www.itlearner.com/ 向您的朋友推荐此文章
• 文章关键词:  BUG  IE  margin 
• 特别声明： 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转载的文章有版权问题请联系我们，我们会尽快予以更正。

• 上一篇：百奥谷-站长网第二届SEO大赛开赛
• 下一篇：怎样合并QQ聊天记录
• 查看2008年04月的文章归档
• 关闭 | 打印 | 保存