li在IE中底部空行的BUG

2022-03-08 21:38:07 字數 960 閱讀 4392

但是這次li在ie中底部出現的不是3畫素而是一整條空白行,如圖:

>第1條連線

a>

li>

<

li><

a href

="#"

>第2條連線

a>

li>

<

li><

a href

="#"

>第3條連線

a>

li>

ul>

css**:

* li li a li a:hover
檢視demo,請使用ie6檢視:

ie6中列表的常見問題出現在當某個 li 中的內容是乙個 display: block 的錨點(anchor)時。在這種情況下,列表元素之間的空格將不會被忽略而且通常會顯示成額外的一行夾在每個 li 之間。一種避免這種豎直方向多餘空白的解決方法是賦予這些錨點 layout。這樣還有乙個好處就是可以讓整個錨點的矩形區域都可以響應滑鼠點選。

解決方案1:

* li li a li a:hover
就是在li a 樣式中加入zoom:1;

解決方案2:

* li li a li a:hover
就是在li 樣式中加入display:inline ;

或者

就是將標籤寫成一行;

* li li a li a:hover
就是在li a 樣式中加入width:100%或者乙個寬度值;

**:

IE6 IE7中li底部4px的Bug

當li的子元素中有浮動 float 時,ie6 ie7中元素的下面會產生4px空隙的bug。xhtml ul class list li div vapour div li li divdiv li li div div li li div 迅雷 div li ul 經過測試發現 li的子元素浮動是...

IE6 IE7中li底部4px的Bug

當li的子元素中有浮動 float 時,ie6 ie7中元素的下面會產生4px空隙的bug。xhtml ul class list li div vapour div li li divdiv li li div div li li div 迅雷 div li ul 經過測試發現 li的子元素浮動是...

IE6 IE7中li底部4px空隙的Bug

當li的子元素中有浮動 float 時,ie6 ie7中元素的下面會產生4px空隙的bug。如下 經過測試發現 li的子元素浮動是這個bug產生的必要條件,這個bug產生的充要條件是li的子元素浮動並且li設定了以下css屬性之一 width height zoom padding top padd...