ie6下3px文本偏移bug

bug重现-haslayout引起

.float-left-div {    float: left;    width: 200px;}.margin-div {    margin-left: 200px;}

如下图所示,在文本和浮动元素之间就会出现一个莫名其妙的3像素间隙。

bug fix

.float-left-div {    _margin-right: -3px;}.margin-div {    _height: 1%;    _margin-left: 0;}

另外一个解决方法是float元素同时加上_display:inline

References

  1. 深入理解 IE haslayout
  2. 拥有布局 IE haslayout
  3. On having layout
  4. hasLayout && Block Formatting Contexts
  5. 一个display:none引起的3像素的bug
  6. 9 Most Common IE Bugs and How to Fix Them