vaadin - 带表格的 CSS，无边框的空行

Question

我在我的元素中使用 Vaadin，目前我遇到了问题。这是 CSS/HTML 问题，我不知道该如何解决...

所以情况看起来是这样的:

我的 HTML 结构 (CustomLayout) 看起来像这样:

<table> 
<tr>
    <td location="loc11"></td>
    <td location="loc12"></td>
</tr>
<tr>
    <td location="loc21"></td>
    <td location="loc22"></td>
</tr>
(...) 
</table> 

我正在使用 location="xxx"将数据插入到 td 中，数据位于某些位置，而不是每个位置。 CSS 看起来像这样:

table.metric_table_layout tr td {
 border-bottom: 1px dotted grey !important;
}

问题来了:

如果 td 是空的，我的边框会完全破坏我的布局。 有人可以给我一些 CSS(也适用于 IE 7+)来解决这个问题吗？ 我不想使用 JS，所以我不确定我是否可以仅使用 CSS 来处理这个问题？

谢谢 齐姆

Answer 1

尝试添加:

table.metric_table_layout {
    border-collapse:separate;
    empty-cells:hide;
}

但在 IE8 中必须有一个 !DOCTYPE 定义。