开发前端的同学一定都知道，IE6 是相容 BUG 多的浏览器，它不支持 PNG alpha 通道暂且不论。其文件的解析理解规范也引起了诸多恼人的 BUG，有时甚至让人感到绝望。本文主要讲解一些比较容易遇到的 IE6BUG，以及解决的办法。
一、 IE6 双倍边距 bug
当页面上的元素使用 float 浮动时，不管是向左还是向右浮动；只要该元素带有 margin 画素都会使该值乘以 2，例如 “margin-left:10px” 在 IE6 中，该值就会被解析为 20px 。想要解决这个 BUG 就需要在该元素中加入 display:inline 或 display:block 明确其元素型别即可解决双倍边距的 BUG
二、 IE6 中 3 画素问题及解决办法
当元素使用 float 浮动后，元素与相邻的元素之间会产生 3px 的间隙。诡异的是如果右侧的容器没设定高度时 3px 的间隙在相邻容器的内部，当设定高度后又跑到容器的相反侧了。要解决这类 BUG 的话，需要使布局在同一行的元素都加上 float 浮动。
三、 IE6 中奇数宽高的 BUG
IE6 中奇数的高宽显示大小与偶数高宽显示大小存在一定的不同。其中要问题是出在奇数高宽上。要解决此类问题，只需要尽量将外部定位的 div 高宽写成偶数即可。
四、 IE6 中图片连结的下方有间隙
IE6 中图片的下方会存在一定的间隙，尤其在图片垂直挨着图片的时候，即可看到这样的间隙。要解决此类问题，需要将 img 标签定义为 display:block 或定义 vertical-align 对应的属性。也可以为 img 对应的样式写入 font-size:0
五、 IE6 下空元素的高度 BUG
如果一个元素中没有任何内容，当在样式中为这个元素设定了 0-19px 之间的高度时。此元素的高度始终为 19px 。
解决的方法有四种:
1. 在元素的 css 中加入：overflow:hidden
2. 在元素中插入 html 注释：
3. 在元素中插入 html 的空白符：
4. 在元素的 css 中加入：font-size:0
六、重复文字的 BUG
在某些比较复杂的排版中，有时候浮动元素的后一些字元会出现在 clear 清除元素的下面。
解决方法如下：
1. 确保元素都带有 display:inline
2. 在后一个元素上使用 “margin-right:-3px
3. 为浮动元素的后一个条目加上条件注释，xxx
4. 在容器的后元素使用一个空白的 div，为这个 div 指定不超过容器的宽度。
七、 IE6 中 z-index 失效
具体 BUG 为，元素的父级元素设定的 z-index 为 1，那么其子级元素再设定 z-index 时会失效，其层级会继承父级元素的设定，造成某些层级调整上的 BUG 。详细解释可以阅读 IE6 中部分情况下 z-index 无效的原因，以及解决办法
结语：实际上 IE6 中，很多 BUG 的解决方法都可以使用 display:inline 、 font-size:0 、 float 解决。因此我们在书写代码时要记住，一旦使用了 float 浮动，就为元素增加一个 display:inline 样式，可以有效的避免浮动造成的样式错乱问题。使用空 DIV 时，为了避免其高度影响布局美观，也可以为其加上 font-size:0 这样就很容易避免一些相容上的问题。