Question

我正在努力将CSS样式应用到Safari中的GWT（Google Web Toolkit）生成的html表中。具体来说，在触发表格的任何重新绘制后，我无法让Safari尊重表格行的高度属性。

以下基本示例说明了问题：

<html>
    <head>
        <style type="text/css">
            tr {
                height: 50px;
                font-weight: bold; /* added to prove that other style rules are re-applied when enabling css again */
            } 
        </style>
    </head>
    <body>
        <table border="1px">
            <tr>
                <td>one</td>
                <td>two</td>
                <td>three</td>
            </tr>
        </table>
    </body>
</html>

如果我在Safari中打开此页面，它首先会正确呈现。如果我然后从“开发”菜单中选择“禁用样式”，然后立即再次重新启用它们，则忽略高度规则，并计算表格行的高度，就好像它被设置为“自动”一样。

这正是在我的GWT FlexTable中以编程方式添加或删除行/单元格时发生的情况。

是否有人知道导致此行为的原因以及是否存在不需要在整个表格上设置固定高度的变通方法？

详细说明：在Mac OSX Leopard上运行Safari版本4.0.3（5531.9）
使用GWT托管模式浏览器（在Mac上运行时基本上是Safari）也会出现问题

Answer 1

TR标签在W3C规范中没有高度属性。您应该设置它包含的TD标记的高度。

Answer 2

WebKit针对性能进行了优化，并且有时会拒绝重绘某些区域，如果它认为不必要的话。您可以通过触发完全重绘来解决此问题，例如：将窗口的大小调整为1px和1px（必须有一些更聪明的方法）。

为什么Safari重新绘制后会忽略css表行（tr）高度属性？

2 个答案: