IE6′s Bug系列之li底部多餘間距

一、問題如下所示：

 1 <style type="text/css"> 2  3 ul{ width:400px; 4     margin:100px 200px;} 5 li{ list-style:none;}    6 li a{ display:block; 7        background:#000; 8        color:#fff; 9        text-decoration:none;}10 li a:hover{ background: #990000;}      11          12    13 </style>14 15 16 17 <ul>18   <li><a href="#">第1條串連</a></li>19   <li><a href="#">第2條串連</a></li>20   <li><a href="#">第3條串連</a></li>21 </ul>

在常規瀏覽器中，顯示正常，在ie6中每行li底部會有多餘的空白間距，相當於每行li都多了幾像素的padding-bottom。

二、解決方案：

（1）為a元素添加樣式{zoom:1}；

（2）將html部分改寫成如下格式（不推薦！！）

<ul>  <li><a href="#">第1條串連</a></li><li><a href="#">第2條串連</a></li><li><a href="#">第3條串連</a></li></ul>