IE6-7裏面li留下空隙

在FF工作正常，IE6-7失敗。

我有一個ul/li結構和裏面我創建一個表來顯示樹行。

在IE上，我和李表之間有差距。

下面是代碼：

<!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> 
<title>IE 6-7 Fails</title> 

<style> 
.table th {white-space:nowrap; font-weight:bold;background:#EDEFF4; 
padding:6px;color:#111;border-right:1px solid #D8DFEA;border-bottom:1px solid #D8DFEA} 
.table th.last-child {border-right:0px solid #D8DFEA} 

.table tr td {padding:6px;border-bottom:1px solid #D8DFEA;background:#ccc} 
.table tr td a {color:#525252;display:block;} 
.table tr td a:hover {color:#3B5998} 

#wrap {margin:5px 0 0 0;color:#525252; 
      border-top:1px solid #D8DFEA; 
      border-right:1px solid #D8DFEA; 
      border-left:1px solid #D8DFEA; 
} 

ul#tree {list-style-type:none;margin:0px;padding:0px} 
ul.tree {list-style-type:none;} 
ul.tTree {list-style-type:none;margin:0px;padding:0px} 
li.tree {margin:0px;padding:0px;} 

li.tree ul{list-style-type:none;margin:0 auto;padding:0 0 0 30px;} 
li.tree ul li{list-style-type:none;margin:0 auto;} 


</style> 

</head> 
<body> 


<div id="wrap"> 
<table border="0" cellspacing="0" cellpadding="0" width="100%" class="table"> 
<tbody> 
    <tr >  
     <th class="last-child" style="text-align:left;">Name</th> 
    </tr> 
</tbody> 
</table> 

    <div id="treeWrap"> 
    <ul id="tree"> 
     <li id="tree-1" class="tree"> 
      <table border="0" cellspacing="0" cellpadding="0" width="100%" class="table"> 
       <tbody> 
        <tr id="gridRow_1"> 
         <td > 
          <a href="...">Title</a> 
         </td> 
        </tr> 
       </tbody> 
      </table> 
      <ul> 
       <li id="tree-2" class="tree"> 
        <table border="0" cellspacing="0" cellpadding="0" width="100%" class="table"> 
         <tbody> 
          <tr id="gridRow_2"> 
           <td > 
            <a href="...">Title</a> 
           </td> 
          </tr> 
         </tbody> 
        </table> 
       </li> 
      </ul> 
     </li> 
    </ul> 
    </div> 

</div> 

</body> 
</html>

它的壞的編程或某種錯誤的？

歡迎任何建議。

來源

2010-02-11 ntan

這將解決你的問題：

。表{垂直對齊：頂部}

或者作爲IE-哈克：

。表{*垂直對齊： top}

來源

2010-02-11 12:31:53

感謝工作就像一個charm.Many千恩萬謝內聯。 – ntan 2010-02-11 12:38:32

如果有人想知道另一種解決方案：

表是塊元素，這就是爲什麼IE瀏覽器把它放在下一行，但你可以改變顯示模式，加入這個styleinformation到表中

style="display: inline-table"

來源

2012-11-14 15:03:52 samoncode

IE6-7裏面li留下空隙

回答

相關問題