ie6 ie7中li下方有間距

2021-06-19 01:32:25 字數 779 閱讀 5740

最近在學做導航條,滑鼠放到應用上,正確顯示為:

chrome、firefox、ie9、ie8裡都顯示正確,就360、搜狗,ie6中顯示的li與下乙個li直接有間距有間距,具體如下

解決方案:

li設定float:left;(切身實踐過的)

以下是引發此bug的條件:

必要條件:

li的子元素設定了浮動(例如:li中的a設定了左浮動)

充要條件:

(ie6/7)li設定了width、height、zoom 之一

(僅ie7)li設定了padding-top、padding-bottom、margin-top、margin-bottom 之一

解決方法:

方案一#list li設定clear:left|both,這時#list li不能設定width、height、zoom。

方案二.hotel_rank .rank_ul li設定float:left,這時.hotel_rank .rank_ul li可以設定width、height、zoom。

方案三給li中的a設定vertical-align:top|middle|bottom

這個例子中。方案二和方案三都可以解決這個問題。

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...