border-radius for table在Firefox中不起作用

Question

在it浏览器和Chrome浏览器中，一切工作正常。但在Firefox中，根本没有圆角。有谁知道问题出在哪里吗？我试着删除了-moz- and -webkit- tag，但没有任何区别。最新版本的Firefox、Chrome和Internet Explorer应该支持Border-radius。

有什么解决方案吗？

代码：

.evenOddColoursLight tr:not(.noEvenOddColoursLight), .evenOddColour1L{
background-color:#f6f6f4;
}
.evenOddColoursLight tr:nth-child(odd):not(.noEvenOddColoursLight), .evenOddColour2L{
background-color:#efeeeb;
}

.forum-table th:first-child {
-moz-border-radius: 10px 0 0 0;
-webkit-border-radius: 10px 0 0 0;
border-radius: 10px 0 0 0;
}

.forum-table th:last-child {
-moz-border-radius: 0 10px 0 0;
-webkit-border-radius: 0 10px 0 0;
border-radius: 0 10px 0 0;

}

.forum-table tr:last-child td:first-child {
-moz-border-radius: 0 0 0 10px;
-webkit-border-radius: 0 0 0 10px;
        border-radius: 0 0 0 10px;
}

.forum-table tr:last-child td:last-child {
-moz-border-radius: 0 0 10px 0;
-webkit-border-radius: 0 0 10px 0;
        border-radius: 0 0 10px 0;

}

.forum-table table tr:last-child td {
border-bottom: none;
}

.forum-table td {
padding:10px;
}

.forum-table th {
padding:5px 5px 5px 10px;
}

所有的at都在代码：http://jsfiddle.net/SUhsD/上找到。

Answer 1

已通过移除.evenOddColoursLight并添加以下内容来解决：

.forum-table tr:nth-child(odd) td, .forum-table tr:nth-child(odd) th {
  background-color: #efeeeb;
}

.forum-table tr:nth-child(even) td, .forum-table tr:nth-child(even) th{
  background-color: #f6f6f4;
}

Answer 2

只需使用单个单元格的样式。火狐和Chrome上的工作示例：http://jsfiddle.net/AyKE7/

CSS

table {
    border-collapse: collapse;
}

th, td {
    padding: 4px 7px;
}

/* hover */
tr:hover th,
tr:hover td {
    background-color: lightblue;
}

/* hover, left cell */
tr:hover th {
    border-radius: 5px 0 0 5px;
}

/* hover, last cell on the right */
tr:hover td:last-child {
    border-radius: 0 5px 5px 0;
}