边框崩溃在 IE10 中不起作用答案

【问题标题】：border collapse not working in IE10边框崩溃在 IE10 中不起作用
【发布时间】：2013-05-22 02:36:40
【问题描述】：

有没有人遇到过在 IE10 中不工作的表格上边框崩溃的解决方案？

我在需要时使用的网站上有表格，它们在所有其他浏览器中都可以正常显示，但是自从 IE 10 开始，边框变得很粗。

任何帮助表示赞赏

【问题讨论】：

您是否有演示问题的演示，例如 jsFiddle？
这是导致问题的页面缩放。按 ctrl+0 将缩放重置为 100%。任何其他缩放级别（放大或缩小）都会导致边框看起来更粗。我还没有找到解决方案，可能没有。
@Nicholas 我有类似的问题，它似乎是缩放的渲染问题。考虑发表您的评论作为答案，我会投票赞成。

标签： border internet-explorer-10 collapse

【解决方案1】：

上述问题可能是几个月前的问题，但今天我遇到了同样的问题，并认为我至少可以提供一些可能的解决方案，即使它不是一个理想的解决方案。

正如问题所描述的，使用border-collapse 会在IE10 中导致粗边框，即使没有可以叠加的边框。省略border-collapse 时，border-width 保持其正常厚度。但是，省略边框宽度会导致单元格之间出现空间。

获得所需结果的唯一可能替代方法是根本不使用边框折叠。相反，使用 'border-spacing:0px;'消除单元格之间的空间并非常具体地定义边界。

示例：

这个

table{
    border-collapse: collapse;
}
table td{
    border: 1px solid black;
}

会变成

table{
    border-spacing: 0px;
    border-top: 1px solid black;
    border-right: 1px solid black;
}
table td{
    border-left: 1px solid black;
    border-bottom: 1px solid black;
}

就像我之前说的：它并不理想，但至少它会提供所需的跨浏览器结果。

注意： IE10 中的问题仅在使用 1px 的边框宽度时才会出现。使用border-collapse:collapse时，1px的border-width将导致2px；在 IE10 中。当使用更高的border-width时，结果将是正常的。

【讨论】：

看起来IE10已经修复了这个问题，但是我来这里寻找IE9的解决方案，发现它适用。 MS 修复 IE9 的可能性接近 0，所以这非常有用。