Question

我需要显示一个HTML，其中各个单元格跨行合并。

这是一个测试，说明了要求和问题： -

<html>
    <head></head>
    <body>
        <table cellspacing="0" cellpadding="0" border="1">
            <tbody>
                <tr>
                    <td rowspan="2" style="height: 40px">
                        <div style="width: 100px;">RS=2</div>
                    </td>
                    <td rowspan="1" style="height: 20px">
                        <div style="width: 100px;">RS=1</div>
                    </td>
                    <td rowspan="3" style="height: 60px">
                        <div style="width: 100px;">RS=3</div>
                    </td>
                </tr>
                <tr>
                    <td rowspan="4" style="height: 80px">
                        <div style="width: 100px;">RS=4</div>
                    </td>
                </tr>
                <tr>
                    <td rowspan="2" style="height: 40px">
                        <div style="width: 100px;">RS=2</div>
                    </td>
                </tr>
                <tr>
                    <td rowspan="2" style="height: 40px">
                        <div style="width: 100px;">RS=2</div>
                    </td>
                </tr>
                <tr>
                    <td rowspan="1" style="height: 20px">
                        <div style="width: 100px;">RS=1</div>
                    </td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

当在Chrome中显示时，它是正常的，但在FF3.6和IE8中它不是（在第一列中查看两个“RS = 2”，它们具有相同的行宽和高度，但明显不同）。行高对我来说非常重要，因为我在旁边显示另一个表，其中有一行固定高度，需要与此表对齐。）

有人可以建议如何在Firefox和IE中纠正这个问题吗？

Answer 1

一些最新的“智能”浏览器会检测到最终的“未关闭标记”错误，并将其显示为您的树已做得很好，但并不总是这样。

检查所有打开的标签是否已关闭，必须有非关闭标签。如果使用Dreamweaver，则可以通过左侧的菜单折叠/展开标记。 - ＆gt; ...＆lt; - 或＆lt; -...-＆gt;

Answer 2

这是一个适用于Firefox但不适用于Internet Explorer的修复程序。从单元格中删除height属性，然后添加

 style="height:20px;"

到所有行OR

在头部添加此样式标记：

<style>
tr{height:20px;}
</style>

这适用于Firefox和Chrome不受影响，但IE仍然一团糟。 Firefox和IE都有渲染表时的错误历史。 discussion of table cell height rendering bug in Firefox

Answer 3

如果没有正确的doctype，你处于怪癖模式，特别是IE，永远不会尝试像所有其他更现代的浏览器一样。在任何情况下，这都不是很好。

HTML表：合并的单元格：FF和IE上的错误高度（ok Chrome）

3 个答案: