Question

我无法在Firefox中获得3px稳定绿色的边框宽度，即使它在Chrome中有效。我怎样才能解决这个问题？我的代码如下。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
        <head>
                <style>
                           td {border: 3px solid green; background:blue;}
                </style>
        </head>
        <body>
                <table>
                        <tr>
                               <td></td>
                               <td></td>
                               <td></td>
                        </tr>
                        <tr>
                               <td></td>
                               <td></td>
                               <td></td>
                        </tr>
                        <tr>
                               <td></td>
                               <td></td>
                               <td></td>
                        </tr>
                </table>
        </body> 
</html>

Answer 1

要消除空格并避免单元格之间的双重边框，您必须将其折叠，例如：

table {
    border-collapse: collapse;
}

DEMO

使用某种CSS差异消除器也是一个好主意，它可以为您节省大量时间并有助于避免这种情况 - Normalize CSS或CSS Reset

Answer 2

这里是jsfiddle（http://jsfiddle.net/jw5Gg/1/）我添加了填充以给它一些空间。但实际上它只有你需要内容的边框。我希望这会有所帮助。

Firefox css在td元素上的border-width

2 个答案: