Safariが再描画後にcssテーブルの行（tr）の高さ属性を無視するのはなぜですか？

StackOverflow https://stackoverflow.com/questions/1627083

質問

CSSスタイルをGWT（Google Web Toolkit）で生成されたSafariの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で開くと、最初は正しく表示されます。 [スタイルを無効にする]を選択すると、 [開発]メニューからすぐに再度有効にすると、heighルールは無視され、テーブル行の高さが「auto」に設定されているかのように計算されます。

これは、GWT FlexTableでプログラムで行/セルが追加または削除されたときに起こることです。

この動作の原因を知っていますか？また、テーブル全体に固定の高さを設定する必要がない回避策があるかどうか

詳細： Mac OSX LeopardでSafariバージョン4.0.3（5531.9）を実行する
この問題は、GWTホストモードブラウザー（Macで実行する場合は基本的にSafariです）を使用しても発生します

役に立ちましたか？

解決

W3C仕様では、

TR タグには高さ属性がありません。代わりに、含まれる TD タグの高さを設定する必要があります。

他のヒント

WebKitはパフォーマンス用に最適化されており、必要でないと思われる場合、特定の領域の再描画を時々拒否します。完全な再描画をトリガーすることで、この問題を回避できる場合があります。ウィンドウのサイズを1pxと1pxずつ変更します（よりスマートな方法が必要です）。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top