html - 表格单元格边框不显示

Question

上图显示了我的问题 - 图像中的单元格本应在每个单元格周围有一个像素红色边框，但只显示一个顶部边框。

我有一个用于表格单元格的无效类，它具有以下 CSS:

th.invalid, td.invalid {
    border: 1px double #b8202a;
}

使用 Chrome 调试器，我可以看到应用于单元格的类，我还可以看到布局表明该单元格应具有指定的边框，但它并没有始终具有红色边框。 增加 double 和 solid 之间的边框大小或类型似乎没有效果。将鼠标悬停在单元格上会显示没有颜色的边框。

我可能做错了什么？ :-)

更新:感谢您的投入。本border color with border-collapse中的信息可能与它出现问题的原因有关。

Answer 1

SOLVED

你好，

我在使用 bootstrap 3 时遇到了同样的情况。

我发现的问题是 Bootstrap 的 css 属性:

table {    
    border-spacing: 0;
    border-collapse: collapse; /* here is the devil */  
}

我确实在我自己的 CSS 中覆盖了它:

table,
table td {
    font-weight: bold;
    background-color: #fff;
    border-collapse: separate; /* This line */
}

然后就成功了..!