IE6的雙倍,3px,注釋引起的文字錯位等幾個BUG解決方法
1、IE 6 中，DIV 使用背景圖片（或直接插入圖片在DIV中）的時候，在圖片的下端會出現一條空白間隔，經測量，剛好是 3px .
解決辦法：
IE6默認字號是12pt ， 默認行高是normal 。
找到原因就好解決了，給DIV加上：font-size: 0px;
2、IE6雙倍浮動BUG及解決辦法
比如
復制代碼代碼如下:
#div1 {
float:left;
margin-left:10px;
width:200px;
height:200px;
border:1px solid red
}
左margin邊界設定為了10px，然后IE6卻偏偏給你顯示成雙倍的20px，
解決辦法：
加上display:inline;
3、ie6/7由注釋引起的文字錯位：
復制代碼代碼如下:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
title多了一只IE6豬/title
/head
body
div style="width:400px"
div style="float:left"/div
!-- --
!-- --
!-- --
div style="float:right;width:400px"這就是多出來的那只IE6豬/div
/div
/body
/html
這是個經典的例子 。IE6在使用一大堆注釋放在包含在同一個DIV的不同元素之時就會這樣，重復一些文字在文字的頂或底部 。
我在ASP生成HTML的循環語句中使用了一段注釋 ， 結果在IE7下顯示整個DIV頂部像空了一截，底部正常，而IE6則頂部空一截，底部還有重影文字，就像上面多出現的豬一樣 。
解決方法是：去掉注釋或者注釋不要放置于2個浮動的區塊之間 。
4、IE6的著名3px BUG（斷頭臺bug）：
復制代碼代碼如下:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title52css.com/title
style type="text/css"
!--
#left {
float:left;
width:200px;
height:100px;
background:#f00;
}
#right {
width:200px;
height:100px;
background:#fc0;
}
--
/style
/head
body
div id="left"oyksoft.com/div
div id="right"oyksoft.com/div
/body
/html
兩個層，一個浮動 ， 一個不浮動，把浮動的一個放在不浮動層中，你會發現兩個之間有點間隙 ， 寬度為3px 。這個問題是最讓人頭疼的問題了 。
解決方法：
1、所有的層都浮動 把右邊那個層也設置成浮動層就可以消除這可惡的3px間隔
2、給左邊的層，應用margin-right:-3px;，同樣可解決IE 3px bug 。
