高さが定義されておらず、内部に 3 つのテーブル行があるテーブルがあります。例：
<table>
<tr height="20px"> <td> </td> </tr>
<tr height="1px"> <td> content with unknown height </td> </tr>
<tr> <td> </td> </tr>
</table>
最初の行の高さを 20px に固定し、2 行目をコンテンツの高さまで拡張し、3 行目を残りのスペースを埋めるようにします。
Javascript でテーブルの高さを変更すると、そのレイアウト (20px - コンテンツの高さ - 残りのスペース) を維持したいのですが、IE7 (およびおそらく 6) では、最初の比率を維持するために行が呼び出されます。
例：
最初の 100px のテーブルに 60px のコンテンツがある場合:
行 1 - 20px
行 2 - 60 ピクセル
行 3 - 20 ピクセル
高さを 200px に変更すると、次のようになります。
- IE6/7 以外のブラウザ/バージョン:
行 1 - 20px
行 2 - 60 ピクセル
行 3 - 120 ピクセル
- IE 6/7:
行 1 - 40 ピクセル
行 2 - 120 ピクセル
行 3 - 40 ピクセル
行の高さを (IE7 で) 修正し、3 番目の行で残りのスペースを埋め、残りの 2 を固定したままにするために何かできますか。