CSS背景颜色与IE中表格单元格的边框重叠

Posted 2023-03-06

【中文标题】CSS背景颜色与IE中表格单元格的边框重叠

【英文标题】：CSS Background-color overlapses with border on table cell in IE

【发布时间】：2015-09-10 21:26:01

【问题描述】：

我有一个包含两个简单表格单元格的表格：

<table>
  <tr>
    <td>Test1</td>
  </tr>
  <tr>
    <td>Test2</td>
  </tr>
</table>

我将以下 CSS 添加到表格单元格中：

td 
  border: 1px solid #000;
  background-color: #CCC;

由于某种原因，当我在 IE 中查看它时，它会在边框顶部显示背景，如果我在 DOM 资源管理器中取消选中背景，我可以看到边框在那里。

我猜这与父元素有关，但是父元素太多了，我无法在此处粘贴所有代码。

有人知道这可能是什么吗？

【问题讨论】：

很遗憾，除非您提供更多代码，否则我们无法重现此内容。 “为什么我的代码不起作用”问题需要至少足够的代码来重现问题。

没有代码有点难帮助，当你添加边框样式时会发生什么：插入；到你的表css？

【参考方案1】：

如果你不想改变定位，试试

background-clip: padding-box;

【参考方案2】：

正如我所料，这是由于 CSS 中的位置规则：

td 
    position: relative

不知道为什么会这样，但删除它解决了它。

我花了很长时间来缩小范围，这就是我首先开始这篇文章的原因，以节省我的时间。但现在好了 :)