firefox - 带圆角的斑马在 Firefox 中不起作用

Question

我的网站上有几个列表：URL 链接

它有斑马剥离背景。在 Chrome 中，我也得到了看起来不错的圆角，但在 Firefox 中它不起作用。我查看了无尽的帮助站点，但没有成功。我唯一了解到的是，当“边框折叠设置为折叠”时，圆角不起作用，但我找到了解决方法。但是 - 它仍然无法正常工作......让我发疯......

这是我目前使用的 CSS：

* TABLES CODES
--------------------------------------- */

table.zebra {
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate; 



}

.zebra td {
    padding: 10px;
    text-align: left; 


}

.zebra tr td:first-child {
    -moz-border-radius-topleft: 10px;
        -moz-border-radius-bottomleft: 10px;
    -webkit-border-top-left-radius: 10px;
        -webkit-border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;

}

.zebra tr td:last-child {
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;

}



.zebra tbody tr:nth-child(even) {
    background: #F0F0F0!important;
    color:#000;

}

Answer 1

尝试更改这部分 CSS：

.zebra tbody tr:nth-child(even) {
    background: #F0F0F0!important;
    color:#000;

}

对这个...

.zebra tbody tr:nth-child(even) td {
    background: #F0F0F0!important;
    color:#000;

}