为什么IE表格单元只有在有内容时才会显示？

Question

这是HTML

<table class = "contact-table">
  <tr>
      <th>First Name(*):</th>
      <td>
          <asp:Label ID="lblFirstName" runat="server" ></asp:Label>
      </td>
  </tr>
  <tr>
      <th>Middle Name</th>
      <td>
          <asp:Label ID="lblMiddleName" runat="server" ></asp:Label>
      </td>
  </tr>
  <tr>
      <th>Last Name(*):</th>
      <td>
         <asp:Label ID="lblLastName" runat="server" ></asp:Label>
      </td>
  </tr>
</table>

这就是css

.contact-table th,
.contact-table td
{
   border: 1px Black solid;      
}

对于 FF 和 Chrome ，情况正常，即 和 td 周围有1px黑色边框。但是，对于IE，只有具有内容的td具有边框。

有什么理由吗？

修改

当我添加 .contact-table td span

时

.contact-table th,
.contact-table td,
.contact-table td span 
{
   border: 1px Black solid;      
}

空单元格在IE中有边框，但是那些之前有边框的单元格在单元格内部有一个额外的边框。

修改

当我以这种方式更改规则时

.contact-table th,
.contact-table td span 
{
   border: 1px Black solid;      
}

.contact-table td span 
{
   width: 100%;      
}

它完美适用于IE，但FF和Chrome现在显示只包含文本的小边框。

有没有办法告诉css根据浏览器应用不同的规则？

Answer 1

你有empty-cells: show设置吗？

请参阅：http://msdn.microsoft.com/de-de/library/ie/cc848860(v=vs.85).aspx