相关疑难解决方法(0)

Firefox中没有显示边框,表格上有边框折叠,位置:tbody上的相对或单元格上的背景颜色

请考虑以下HTML:

<html>
<head>
    <style>
        TABLE.data TD.priceCell
        {
            background-color: #EEE;
            text-align: center;
            color: #000;
        }
    
        div.datagrid table
        {
            border-collapse: collapse;
        }
    
        div.datagrid table tbody
        {
            position: relative;
        }
    </style>
</head>
<body>
    <div id="contents" class="datagrid">
        <table class="data" id="tableHeader">
            <thead>
                <tr class="fixed-row">
                    <th>Product</th>
                    <th class="HeaderBlueWeekDay">Price</th>
                    <th class="HeaderBlueWeekDay">Discount</th>
                </tr>
            </thead>
            <tbody>
                <tr style="font-style: italic;">
                    <td>Keyboard</td>
                    <td class="priceCell">20</td>
                    <td style="border-right: #3D84FF 1px solid; border-left: #3D84FF 1px solid;" class="priceCell">2</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

请注意,最后一个单元格的内联样式具有左边框和右边框.你(或至少我)会期望这是可见的.在IE中,情况就是这样.但在Firefox(6)中,事实并非如此.你可以通过以下方式解决

  • div.datagrid table tbody在CSS中删除相对位置
  • 更改div.datagrid table tbody到div.datagrid …

css firefox border

74
推荐指数
4
解决办法
4万
查看次数

标签 统计

border ×1

css ×1

firefox ×1