javascript - IE6/7 でテーブルが「屈曲」しないようにする方法

Question

いくつかの新しい要素を DOM に追加する ajax 呼び出しを開始する「詳細を表示」する機能を備えた表形式のデータがあります (通常、選択した行と innerHTML の直後に別の TR を挿入するか、colspan を使用して TD 内に追加します。

私の質問はこれです.IE6/7では私の列は曲がっています. 現在、列ごとに「静的な」幅がなく、可能であればこれを避けたいと考えていました。

この「フレックス」を避けるための提案はありますか?

Answer 1

ここでのこのトリックは、やや難解なtable-layout:fixedルールを使用しています

次のように使用します。

table {table-layout:fixed}

また、s の列幅を明示的に指定する必要があります<td>。

ルールには、「このtable-layout:fixedテーブルのセル幅は、セルの実際の内容ではなく、私の発言に依存する」と書かれています。これは、ブラウザが最初の を受信した後にテーブルの表示を開始できるため、通常は便利です<tr>。それ以外の場合、ブラウザは列幅を計算する前にテーブル全体を受け取る必要があります。ただし、絶対的な列幅を維持することも役に立ちます。

Answer 2

テーブルはコンテンツに基づいて動的にサイズ変更されます。それが彼らの性質です。テーブルがレンダリングされるときに常にテーブルの「自然な」列幅を読み取り、スタイルを適用してその形状に固定してから、Ajax 呼び出しを行うことができます。

Answer 3

フレックスと言うのはリサイズのことですか？DOM 内の何かを変更して再描画すると、最初に項目をページにレンダリングしたときと同じように動作することに注意してください。テーブルで見た最良の結果は、コンテナーをクリアし、テーブルを作成してからコンテナーに追加することです。

クラス、スタイル、または属性を介して静的な幅を宣言していないために、列自体のサイズ変更について話している場合、列はコンテンツに基づいてサイズ変更されます。