没有内容的TD，TH在Internet Explorer中始终为0高度

Question

我发现在IE中，如果TD或TH没有内容，则将其大小视为0 x 0像素。在Chrome中，其高度是根据行的高度来计算的，而行的高度是根据行的内容来确定的。

之所以意识到这一点，是因为我试图将:after伪元素添加到没有内容的TH元素中。在Chrome中，伪元素跨越行的高度，但是在IE中，伪元素仅高几个像素。

我尝试在TD中放入 ，这让我参与其中，但是由于TH的行距为2，因此IE仅将高度计算为1行文本，而不是整个高度

这是可以在IE中解决的问题吗？

.test
{
    position: relative;
}

.test:after
{
    width: 5px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    display:block;
    content: ' ';
    background-color: #007bff;
}

Answer 1

只需插入：

 

到空的TD或TH元素。

Answer 2

要么使用<p>&nbsp;</p>，要么插入一个空gif，以提高设计的稳定性。 “垫片”只是一个1像素的正方形图像，该图像是透明的，可以根据需要进行调整（通过宽度和高度）。

在这些引号之间可以找到垫片“ ”吗？

在<div>时代和响应式布局出现之前，表格是网页设计的主导。如果要制作实线，可以在表格行/列中放置垫片，指定<td>的颜色，并使用编码为所需高度和宽度的垫片或垫片图像。这样做可以使您的网页加载速度更快，因为图像的大小为<= 1kb，这在拨号访问的那几天是一个至关重要的考虑因素。