IE6雙倍距的問題

問題： 當浮動元素設定margin邊距時，邊距會加倍。
解決方法：是給浮動元素加上display：inline屬性

IE6圖片下方有空間隙

問題：圖片的下方預設的空隙
解決方案： 給img設定 display:block屬性

IE63畫素偏移BUG

問題：當浮動元素與非浮動元素相鄰（注意這裡的相鄰可以是縱向的也可以是橫向的）時，這個3畫素的Bug就會出現，它會偏移3畫素。實際表現就是兩個元素之間產生了一道縫隙！
解決方案：將兩個元素都浮動就OK了。此BUG深層的原因是非浮動元素的layout未觸發，所以這裡只要是能夠觸發layout的css都可以解決問題。

相對位置和溢位隱藏

問題：當父元素的overflow被設定成hidden並且子元素被設定成position:relative。
解決方案：為父元素增加position:relative;

IE的最小高度

問題：沒有最小高度的概念
解決方案：IE忽略min-height屬性。採用這種暴力的方式解決：

selector {
   min-height:500px;
   height:auto !important;
   height:500px;
}

IE6,7失效的margin-left/right

問題;

<div class="wrap">
    <div class="cont">banggan</div>
</div>
wrap{background:#eee;border:1px solid #ccc;}
cont{border-bottom:2px solid #aaa;margin:0 100px;height:30px;}
 

解決方案：觸發.warp的layout就可以了。具體的比如：給.warp加上zoom:1或者width等等。

PNG透明

所以如果你想要使用透明影象並且GIF不能給你想要的質量，你會需要這個對PNG的hack。你必須意識到，如果你使用一張PNG影象作為背景，你將不能設定背景的位置。解決方案：

img {
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(...);

｝

禁用IE預設垂直滾動條

預設情況下，即使內容適合視窗大小，IE(譯註：IE6/7)也會顯示垂直滾動條。你可以使用overflow:auto，讓滾動條只在你需要時出現

:hover偽類

IE只支援a元素的 :hover偽類。使用jQuery的hover event來達到相同效果。

IE中 Iframe透明背景

在firefox和safari裡你應該不會遇到這個問題因為預設情況下，iframe的背景被設定為transparent，但是在IE裡，卻不是如此。你需要用到allowTransparency 屬性並且加入下面的CSS程式碼來達成目的。

/* in the iframe element */
<iframe src="content.html" allowtransparency="true">
</iframe>

/* in the iframe docuement, in this case content.html */
body {
    background-color:transparent;
}

其他

• input[button | submit] 不能用 margin:0 auto; 居中，為input新增width
• body{overflow:hidden;}沒有去掉滾動條，設定html{overflow:hidden;}
• hasLayout的標籤擁有高度，*height:0;_overflow:hidden;
• :hover偽類不能改變有position:absolute的子級元素的left/top值，把top/left的值設定成除0%外的所有百分值；或新增一個margin-[所有方向]除0外的所有值，包括0%
• margin:0 auto; 不能讓block元素水平居中，給block元素新增一個width
• form>[hasLayout]元素有margin-left時，子元素中的[input | textarea] 出現2×margin-left，form > [hasLayout 元素]{margin-left:寬度;}form div{*margin-left:寬度÷2;}
• 當border-width有1條<邊3條時被設定成dotted時，1px的邊dotted顯示成dashed，不在同一個元素上使用不同寬度的 dotted
• :focus + selector {} 選擇器失效，在失效選擇器後面新增一個空選擇器, :focus{}
• 列表中混亂的浮動：在list中浮動圖片時，圖片出現溢位正常位置；或沒有list-style，用背景圖片替換list-style
• th 不會自動繼承上級元素的 text-align，給th新增text-align:inherit;
• :hover 時若background-color為#fff, 失效，把background-color改成background。或者，非#fff || #ffffff