IE6下参照物宽高为奇数时,绝对定位元素设置了位置为0或100%时,仍会有1px的空隙,这个时候我们只需要给参照物高度设置为偶数即可解决。
范例HTML代码
<h2>bug</h2>
<p>IE6下参照物宽高为奇数时,绝对定位元素设置了位置为0或100%时,仍会有1px的空隙</p>
<div class="m-demo">
<div class="itm itm-1"> </div>
<div class="itm itm-2"> </div>
<div class="itm itm-3"> </div>
<div class="itm itm-4"> </div>
</div>
<h2>fix</h2>
<p>设为偶数</p>
<div class="m-demo m-demo-fix">
<div class="itm itm-1"> </div>
<div class="itm itm-2"> </div>
<div class="itm itm-3"> </div>
<div class="itm itm-4"> </div>
</div> 解决CSS代码
/* IE6中绝对定位1像素偏差 */
.m-demo{position:relative;width:501px;height:101px;margin:0 0 20px;background:#ff0097;}
.m-demo .itm{position:absolute;width:20px;height:20px;overflow:hidden;background:#4eb3b9;}
.m-demo .itm-1{top:0;left:0;background:#999;}
.m-demo .itm-2{top:0;right:0;}
.m-demo .itm-3{left:100%;top:100%;}
.m-demo .itm-4{left:0;bottom:0;}
.m-demo-fix{width:500px;height:100px;}

