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留下空隙

回答

相关问题