Html 表<；td>；伪类高度（Internet Explorer）

首先，我认为这种风格在Chrome/Firefox中是不可能的，但令人惊讶的是它居然奏效了！但是，它在Internet Explorer中显示的内容不同（有什么新的吗？）

当它在Chrome/Firefox/Safari/Opera中工作时，我想它至少可以在最新版本的Internet Explorer中工作，但从IE11开始我就遇到了同样的问题。我还没有在EDGE上测试过

下面是一个代码笔，显示标记/CSS：

基本上，我有一个相当标准的表，但一行是'选定'略宽于其他。我使用所选行的第一个和最后一个

的

：before

伪类实现了这一点，有点像这样：

tr.selected td {
    background-color: @brown-lightest;
    position: relative;
}

tr.selected td:first-child:before,
tr.selected td:last-child:before {
    background: @brown-lightest;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    left: -5px;
    top: 0;
    width: 5px;
}

tr.selected td:last-child:before  {
    left: auto;
    right: -5px;
}

有时它“看起来”像是工作的，但似乎第一个和最后一个

的内容都需要相同的高度才能工作。即使设置了

td:before{height:100%；}

，它似乎取的是文本的高度，而不是

。这是奇怪的，因为它是一个表布局，所有的高度在一行应该是相同的

我知道这在IE中是不可能的，但我想我会看看是否有人知道为什么会发生这种情况，因为这不是浏览器无法做到的简单事实

---

提前谢谢

老实说，那样做很麻烦。我建议检查引导CSS，为什么？它是专门为对抗它而设计的

但是，如果您想这样做，只需用标记将其包装起来

Example
<span style="color: red; background-color: blue; "><td>RandomData</td></span>

示例
随机数据

---

这些只是选择，然而，在第一个和第二个孩子的分数上，其他人可能比我更好

我认为在

中包装

会创建非法的HTMLI的想法是一样的，除了

元素之外，我认为您需要的任何附加标记都必须位于

内或包装在整个

元素周围。