javascript - CSS border-right, border-bottom 在 firefox 中不显示

Question

我正在使用 javascript 开发 Tic TAc Toe AI。

DEMO

如果您使用的浏览器不是 IE 或 Firefox，您会注意到屏幕上有一个蓝色的井字棋盘。但是，如果您使用的是 firefox，则该板不会显示，而在 Chrome 中，该板会一团糟。这是我的 HTML:

<table id="ticTable" cellpadding="0" cellspacing="0">
    <thead>
        <th colspan="3" id="status">&#x2d;&#x2d;&#x2d;&#x2d;</th>
    </thead>
    <tr>
        <td width="110" height="110"></td>
        <td width="110" height="110"></td>
        <td width="110" height="110"></td>
    </tr>
    <tr>
        <td width="110" height="110"></td>
        <td width="110" height="110"></td>
        <td width="110" height="110"></td>
    </tr>
    <tr>
        <td width="110" height="110"></td>
        <td width="110" height="110"></td>
        <td width="110" height="110"></td>
    </tr>
</table

这是我的 CSS:

td{
    margin:0px;
    padding:0px;
    border-bottom:5px solid #58ACFA;
    border-right:5px solid #58ACFA;
    text-align:center;
}
tr:last-of-type td,
tr td:last-of-type{
    border-bottom:none;
}

这在 Safari 和 Chrome 中完美运行:

但是，Firefox 中什么也没有。

如何在 Firefox 中修复此板？谢谢!

Answer 1

或者试试

margin:0px auto;
padding:0px;
border-bottom:5px solid #58ACFA;
border-right:5px solid #58ACFA;
text-align:center;