html - 表格的底部边框不显示

Question

我正在尝试在我的 WP 网站上显示一个表格，我只是在学习 CSS，但是当我创建我认为应该正确的内容时，结果并不正确。仅显示右外、左外和上边框。

.front {
    border: 2px solid red;
}

我把它放在表类中。我还尝试添加另一个底部边框，即使是单独添加，也没有。这是我的表格代码，非常简单。只是想学习使用 CSS。

<table class="front">
<tbody>
<tr>
<td>test.</td>
<td>test.</td>
</tr>
<tr>
<td colspan="2">test.</td>
</tr>
</tbody>
</table>

我在这里搜索并尝试了这个，但没有用(我在这里找到了其他东西，但我记得这个):

table {
    border-collapse: separate;
}

我应该注意，我使用了一个 CSS 插件来使我更容易将它添加到 CSS。没怎么用过，一个简单的隐藏，效果很好。不确定这是否与此有关，只是一些可能有帮助的额外信息。

Answer 1

问题可能是表格的高度或放置的容器。

看this fiddle并尝试将表格的高度设置为 100%，如下所示:

.front {
    border: 2px solid red;
    height: 100%;
}