在IE6中,如果你设置了浮动,并给浮动元素设置了margin的话,你会发现margin的距离双倍了,下面青岛星网给大家讲下:IE6浮动元素margin加倍解决方法。

范例HTML代码
<h2>bug</h2>
<p>第一个左浮动元素的margin-left加倍</p>
<div class="m-demo">
<div class="itm itm-left">1</div>
<div class="itm itm-left">2</div>
<div class="itm itm-left">3</div>
</div>
<p>第一个右浮动元素的margin-right加倍</p>
<div class="m-demo">
<div class="itm itm-right">1</div>
<div class="itm itm-right">2</div>
<div class="itm itm-right">3</div>
</div>
<h2>fix</h2>
<p>因为内联元素没有此问题,所以通过设置display:inline解决</p>
<div class="m-demo m-demo-fix">
<div class="itm itm-left">1</div>
<div class="itm itm-left">2</div>
<div class="itm itm-left">3</div>
</div>
<div class="m-demo m-demo-fix">
<div class="itm itm-right">1</div>
<div class="itm itm-right">2</div>
<div class="itm itm-right">3</div>
</div> CSS解决方法
/* IE6中浮动双边距 */
.m-demo{width:400px;height:20px;margin:0 0 10px;background:#ddd;}
.m-demo .itm{width:20px;height:20px;line-height:20px;text-align:center;color:#fff;background:#ff0097;}
.m-demo .itm-left{float:left;margin-left:20px;}
.m-demo .itm-right{float:right;margin-right:20px;}
.m-demo-fix .itm{display:inline;}

