表差异Firefox和Chrome - 表格行

时间:2015-03-22 23:24:32

标签: html css google-chrome firefox html-table

我不得不建立一个网站,主要是桌子(非常旧的网站)有点响应。我已完成所有更改,并始终使用Firefox Dev Edition和其中的Responsive Design View功能对其进行测试。

现在在 Firefox开发版(以及标准Firefox )中看起来不错,但在 Chrome 和其他浏览器中它显示的有点不同。< / p>

它在 Firefox开发版中的外观如下:

enter image description here

这是 Chrome

的外观

enter image description here

正如您所看到的,我的表格略有不同。这是我表格的一部分的HTML(表格标题和第一行):

<table class="FontNormal">
    <tbody>
        <tr>
            <td colspan="4" align="right">
                <a href="newtopic.asp">New topic</a>
            </td>
        </tr>
        <tr>
            <td>&nbsp;</td>
        </tr>
        <tr class="TableHeader" valign="top">
            <td width="500">Topic</td>
            <td width="150">
                <a href="default.asp?DS=A"><font color="black">Last Post</font></a>&nbsp;<img src="../images/sortdesc.gif">
            </td>
            <td>Product</td>
            <td>Group</td>
        </tr>
        <tr>
            <td style="max-width: 462px;">
                <a href="showtopic.asp?ID=3209">Baxter - Black Piping</a> (0)
            </td>
            <td style="max-width: 462px;">
                14/02/2015 00:29:02
            </td>
            <td style="max-width: 462px;">
                Pharma
            </td>
            <td style="max-width: 462px;">
                BDT Industry
            </td>
            <td style="max-width: 462px;">
                <a href="deletetopic.asp?ParentID=-1&amp;ID=3209">Delete</a>
            </td>
        </tr>
    </tbody>
</table>

我没有reset.css。有没有办法可以快速解决这个问题而无需额外编程?

1 个答案:

答案 0 :(得分:1)

每行中有不同数量的列。确保列数一致且浏览器将是一致的。我认为您看到的是Chrome和Firefox之间的不同处理方式,即每行中的列数不匹配。

<table class="FontNormal">
<tbody>
    <tr>
        <td colspan="5" align="right">
            <a href="newtopic.asp">New topic</a>
        </td>
    </tr>
    <tr>
        <td colspan="5">&nbsp;</td>
    </tr>
    <tr class="TableHeader" valign="top">
        <td width="500">Topic</td>
        <td width="150" colspan="2">
            <a href="default.asp?DS=A"><font color="black">Last Post</font></a>&nbsp;<img src="../images/sortdesc.gif">
        </td>
        <td>Product</td>
        <td>Group</td>
    </tr>
    <tr>
        <td style="max-width: 462px;">
            <a href="showtopic.asp?ID=3209">Baxter - Black Piping</a> (0)
        </td>
        <td style="max-width: 462px;">
            14/02/2015 00:29:02
        </td>
        <td style="max-width: 462px;">
            Pharma
        </td>
        <td style="max-width: 462px;">
            BDT Industry
        </td>
        <td style="max-width: 462px;">
            <a href="deletetopic.asp?ParentID=-1&amp;ID=3209">Delete</a>
        </td>
    </tr>
</tbody>

colspan属性将使一个单元格跨越X列,因此如果按上面使用它们将始终等于5.

相关问题