IE和FF使我的表“意外”(IE and FF render my table “unexpecte

2019-10-28 16:46发布

我一直在挣扎与表格的布局，现在我想实现我的应用程序的教训-这所谓的“简单地呈现运动”还是毁了我的一天：（（

该下面的屏幕截图示出了该问题的比特：2行具有20像素的一个固定的高度，但如第5栏是太唤起注意，IE拆分neccassary“填充”在所有的行相等，而FF尊重分配行高和仅延伸最后一行瓦特/ OA高度规格。（在我的实际情况，也FF呈现不正确，扩大行W¯¯固定的高度）。

所以我想如果有也许是安全的（跨浏览器）解决方案来解决这个问题？？？

码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
</head>
<body>
    <table border="1" cellspacing="2" cellpadding="2">
    <tbody>
        <tr style="height:20px;"><td style="height:20px;">1a</td><td>1/2</td><td>1/3</td><td>1/4</td>
        <td rowspan="4" style="height: 300px;">the <span style="background-color: yellow">supacell</span> just contains a lot of text and other info, variable height etc.</td></tr>
        <tr><td height="20">bla2</td><td><input type="text" /></td><td>2/3</td><td>2/4</td></tr>
        <tr><td height="20">bla3</td><td>3/2</td><td>3/3</td><td><textarea cols="20" rows="4">bla</textarea></td></tr>
        <tr><td colspan="4">no height</td></tr>
        </tbody>
    </table>
</body>
</html>

尝试设置line-height属性，而不是/以及height属性，你所看到的微胖/利润率是行高计算的结果，通过定义它，你就可以修复它，并保持它不变浏览器之间。