3

スパンされていないすべての行を合わせたものよりも大きいセルの行スパンに関連する Chrome/ Webkitの問題に対する既知のスクリプト以外の回避策はありますか? Chrome は兄弟行を均等に分散せず、残りのスペースを埋めるために最後の行のサイズを変更するためです。

この例を別のブラウザで見ると、下の画像のような結果が表示されます。

列のスパンは期待どおりに機能します

列のスパンが期待どおりに機能することに注意してください。すべての列が展開され、最も幅の広い列に対応します。他のセルの幅が均等である場合、それらも均等に拡張されますが、幅が設定されていない場合は、コンテンツに応じて拡張されます (通常どおりにレンダリングされます)。

スクリーンショットの例

外側の境界線はテーブルの境界線を示し、内側の境界線はセルの境界線を示します。表示上の理由から、境界線を折りたたまなかったので、個々の要素の境界線は他の要素から分離されています。

Internet Explorer (驚くべきことに) と Firefox での表示:

均等な行分布

Chrome (またはその他の Webkit ブラウザー) での表示:

行分布の偏り

rowspan大きな値の追加観測

私の例では 4 つの行があり、最初の行の最後のセルは 4 つすべてにまたがっています。値を 4 より大きい値に変更すると、webkit は実際には存在しない 5 行目をセルなしでレンダリングします。したがって、4 行目を拡張して残りのスペースをすべて取得する代わりに、存在しない 5 行目の場合と同じようにします。Chrome での結果は次のようになります (ボットは他のブラウザーではありません)。

追加の存在しない行

4

1 に答える 1

0

これを読んだときの最初のアイデアは、次のようにすることです。

<table class="details"><tr><td  >First col</td></tr>
            <tr><td >First col</td></tr>
    <tr><td >First col</td></tr>
    <tr><td >First col</td></tr>
    </table>
<td>Kleke</td>

次に、CSS を介して境界線を管理します (そのためにヘルプが必要な場合は、コメントを残してください)。

乾杯フェリックス

編集：あなたが求めたのは2013年ではなく2012年であることに気付きました。より良い代替ソリューションなどを提示できる場合は、投稿してください。

于 2013-10-18T11:23:03.217 に答える