问双边框CSS3 - FF !Chrome

EN

试试这个，它在两个浏览器上都可以工作：

td {
     -moz-box-shadow: 0 1px  0 #000;
 -webkit-box-shadow: 0 1px  0 #000;
        border-bottom: 1px solid red;
         box-shadow: 0 2px  0 #000;

}

我想，这就是问题所在：box-shadow: 0 1px 0 #000;

当border属性本身已经支持双边框时，我不确定为什么要使用box-shadow生成双边框。只需使用以下CSS，而不是您已有的CSS：

td {
    border-bottom: 3px double red;
}

注您需要将边框的大小增加到3px，以便这两行都显示出来(对于1px，当您指定double时，它有时根本不显示)。

另一个优点是，这将在所有浏览器中工作，包括不支持box-shadow的旧浏览器。

增加边框厚度，以查看两个浏览器之间渲染差异的更多obvious demonstration。似乎在FF中，框阴影被覆盖在边框的顶部，而在Chrome中，它隐藏在下面。

您可以使用另一种方法--也许使用底部边框和文本装饰相结合的方式: underline。