Html Firefox中奇怪的表呈现_Html_Css_Firefox_Html Table_Windows 8.1

Html Firefox中奇怪的表呈现

html css firefox

Html Firefox中奇怪的表呈现,html,css,firefox,html-table,windows-8.1,Html,Css,Firefox,Html Table,Windows 8.1,我在Windows8.1上使用Firefox26.0。简单的表格html+css布局在不同的缩放级别上呈现得很奇怪 100%放大Firefox是可以的。IE和Chrome正确渲染文档。将html代码更改为常规表/tr/td没有帮助这是Windows8.1上Firefox的bug还是布局有问题 HTML代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

我在Windows8.1上使用Firefox26.0。简单的表格html+css布局在不同的缩放级别上呈现得很奇怪

100%放大Firefox是可以的。IE和Chrome正确渲染文档。将html代码更改为常规表/tr/td没有帮助

这是Windows8.1上Firefox的bug还是布局有问题

HTML代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
    <div id="board">
        <div class="row">
            <div class="cell"></div>
            <div class="cell"></div>
            <div class="cell"></div>
            <div class="cell"></div>
            <div class="cell"></div>
        </div>
    </div>
</body>
</html>

#board {
    display: table;
    border-collapse: collapse;
}

.row {
    display: table-row;
}

.cell {
    border: 1px solid;
    display: table-cell;
    height: 1em;
    width: 1em;
}

结果：

100%-2缩小：

100%-3缩小：

100%+1放大：

100%+3放大：

来自Bugzilla：

错误410959-[BC]表格单元格边框宽度在各种缩放级别

这是一个问题，至今还没有人解决

此外，如果您有表格数据，请使用

table

而不是

div

解决方法是使用

边界折叠：分离
#board {
    display: table;
    border-collapse: separate;
}

（使用边框折叠：collapse；
放大和缩小时的buggy演示）
感谢您快速而全面的回答！