我有一张桌子,对于我的一个细胞我正在使用规则
border-right: 3px solid #000 !important;
它在Chrome上工作正常,但在Firefox中,边框是不可见的.我说隐形,因为如果我停用规则,我可以看到细胞的内容稍微移动.
-moz-Box-sizing: border-Box;
没有任何帮助,只要我能看到.
所以,如果你在Chrome中运行this小例子,看起来会很好.在Firefox中,您可以发现一些错误(请确保在更宽的宽度上查看以查看错误)
我已经尝试过各种其他建议的选项,没有很好的结果.更接近解决这个问题的办法是完全消除边界崩溃,但这样可以使所有边界都可见,如下图所示：
这是Firefox的常见问题,我如何克服这个问题.
解决方法
我已经更新了您的原始jsfiddle
https://jsfiddle.net/sfodcjkz/4/与一些小的调整
https://jsfiddle.net/sfodcjkz/18/.
https://jsfiddle.net/sfodcjkz/18/.
我在你的小提琴上的变化是：
>删除空的< tbody>元素.最佳做法是将身体行分组到< tbody>内.一些现代浏览器可能会自动更正错误,但并不是所有浏览器都足够聪明.所以为了一致性,我们可以避免依赖于更智能的浏览器.
>接下来我有这些css的问题：
行：349
.responsive-table thead {
clip: auto;
height: auto;
overflow: auto;
position: relative;
width: auto;
}
行：258
.responsive-table thead {
border: 0 none;
clip: rect(1px,1px,1px);
height: 1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
简单地删除那些CSS样式,你可以看到一个更干净的外观.
