在FF中缺少表边框

问题描述

我有一个数据表，当我在FF中查看一些边框没有显示。请参阅附加的屏幕截图。

I have a table with data and when I view it in FF some of the borders are not showing. Please see screenshot attached.

这不会发生在任何其他浏览器。已在FF，IE，Safari和Chrome中测试。

This does not happen in any other browsers. Tested in FF, IE, Safari and Chrome.

有什么想法为什么要修改吗？

Any idea why and hot to fix it?

使用样式格式化表格：

.myTbl {
  border: 2px solid #cccccc;
  border-collapse: collapse;
}

.myTbl th, .myTbl td {
  white-space: nowrap;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  padding: 2px;
}

.myTbl td {
  text-align: center;
  width: 15%;
}

.myTbl tr:hover td {
  background-color: #ffffcc;
}

.myTbl thead th, .myTbl thead:hover th {
  text-align: center;
  font: normal 10px arial, verdana, sans-serif;
  background-color: #ffffff;
}

HTML：

<table class="myTbl">
<thead>
<tr>
    <th></th>
</tr>
</thead>
<tbody>
<tr>
    <td></td>
</tr>
</tbody>
</table>

================= UPDATE === ==================

================= UPDATE =====================

以下内容似乎解决了我的问题。我替换了：

For what it's worth the following seem to have solved my issue. I replaced:

border-collapse: collapse;

border-collapse: separate;
border-spacing: 0;

推荐答案

边框折叠：折叠 - 边框折叠成（边框间距和空单元格属性将被忽略）

Border-Collapse:Collapse - Borders are collapsed into a single border when possible (border-spacing and empty-cells properties will be ignored)

边框折叠：分隔边框 - 边框被分离不会被忽略）。这是默认值

Border-Collapse:Seperate - Borders are detached (border-spacing and empty-cells properties will not be ignored). This is default

此链接可能有助于您了解边框合拢：折叠和分离，并了解其工作原理。

This link might be helpful for you to understand border-collapse:collapse and seperate and to understand how it works.

这篇关于在FF中缺少表边框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！