网页制作教程:IE下div出现3个像素的Bug问题

武林网(www.vevb.com)文章简介：IE下两个div之间会出现3个像素的Bug.

描述：IE下两个div之间会出现3个像素的Bug，这个bug是在当对一个div用了float元素时，而令一个div未使用时则会出现。

解决方法：a.对另一个元素同时使用float； b.为不浮动的div添加一条语句：margin-right:-3px; 或者margin-left:-3px; ；

#container {margin:0 auto; width:100%;}
#sidebar { float:left; width:200px; height:500px; background:#9c6;}
#sidebar2 { float:right; width:200px; height:500px; background:#9c6;}
#content { margin:0 205px ; _margin:0 202px; height:500px; background:#ffa;}

当浮动元素与非浮动元素相邻时，这个3像素的Bug就会出现，它会偏移3像素。只要触发IE的hasLayout，非浮动元素就会拥有布局。所以，利用IE6特有的hack规则，为它单独写样式就可修复此问题：_zoom:1;margin-left: value;_margin-left: value-3px;zoom 是IE触发Layout条件之一，因为它是IE特有的CSS规则，所以采用zoom。margin-left: value-3px 是修复IE6 中3px 的bug。此前采用非浮动元素也浮动的方法修复bug，现在我们可以试试这个新的方法了！注：前面的下划线是专门写给IE7以下版本的hack！