IE6的3像素bug解决方法

3像素bug是IE6的一个著名的bug，当浮动元素与非浮动元素相邻时，这个3像素的Bug就会出现。看下面这个左列浮动，右列不浮动的例子，css代码如下：

#side { float: left; background:#99FF99; height: 300px; width: 120px;}

#main { background: #99FFFF; height: 300px;}

 

如下图所示

  

side元素设置了浮动，main没有设置，中间会有3px的间距。

 

要解决这个问题，可以在#side上加上 _margin-right:-3px; 记住，前边加上下划线，这样这个样式专门针对IE6生效。但它不能通过W3C验证。

 

最好的解决方法还是把#main也设置浮动，这样就可以避免IE6的3像素bug了。