边框不在Firefox中显示，边框合拢在表格上，位置：相对于tbody或单元格上的背景颜色 [英] Borders not shown in Firefox with border-collapse on table, position: relative on tbody, or background-color on cell
问题描述
请考虑以下HTML：
<html>
<head>
<style>
TABLE.data TD.priceCell
{
background-color: #EEE;
text-align: center;
color: #000;
}
div.datagrid table
{
border-collapse: collapse;
}
div.datagrid table tbody
{
position: relative;
}
</style>
</head>
<body>
<div id="contents" class="datagrid">
<table class="data" id="tableHeader">
<thead>
<tr class="fixed-row">
<th>Product</th>
<th class="HeaderBlueWeekDay">Price</th>
<th class="HeaderBlueWeekDay">Discount</th>
</tr>
</thead>
<tbody>
<tr style="font-style: italic;">
<td>Keyboard</td>
<td class="priceCell">20</td>
<td style="border-right: #3D84FF 1px solid; border-left: #3D84FF 1px solid;" class="priceCell">2</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
请注意，最后一个单元格在其内联样式中有一个左边框和一个右边框。你（或至少我）期望这是可见的。在IE中，就是这种情况。但在Firefox（6），这不是。您可以通过以下方法解决：
Notice that the last cell has a left and a right border in its inline style. You (or at least I) would expect this to be visible. In IE, this is the case. But in Firefox (6), this is not. You can solve this by:
- 删除
上的位置div.datagrid table tbody在中 > in the CSS - 移除
背景颜色于table.data td.priceCellin the CSS - 移除
border-collapse 于div.datagrid表格在CSS
- Removing position relative on
div.datagrid table tbodyin the CSS - Changing
div.datagrid table tbodytodiv.datagrid tablein the CSS - Removing the
background-colorontable.data td.priceCellin the CSS - Removing the
border-collapseondiv.datagrid tablein the CSS
这是我们的代码的简化版本;我们也解决了（通过选择选项2）。但我想知道的是：
This is a simplified version of our code; we also solved it (by choosing option 2). But what I'm wondering about is:
- 这是Firefox中的错误吗？
- 这是IE中的一个错误？
特别是：当CSS是CSS时，Firefox不显示边框的原因是什么？
And especially: what is the reason Firefox wouldn't show the borders when the CSS is as it is?
推荐答案
这看起来像是一个Firefox错误。背景是在边界上绘画;
This looks like a Firefox bug to me. The backgrounds are painting over the borders; you can see it if you use a translucent background color.
我提交了 https://bugzilla.mozilla.org/show_bug.cgi?id=688556
这篇关于边框不在Firefox中显示，边框合拢在表格上，位置：相对于tbody或单元格上的背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
