利用側の問題ではないので根本的な対処となると不可と思われますが不具合の内容をまとめておきます。
IE6では、インライン要素にプロパティborder
で枠線を設定した場合に改行の前後で縦線が入ります。もじら組のWeb標準普及プロジェクトのWeb標準化Tipsに解説があります。ブロックレベル要素とインライン要素の項目5から6付近が該当記事となります。
表幅はセレクタtable
のプロパティでwidth:98%
と指定しているため、ボックス幅(全体の幅)は文字数などの内容で表毎に可変とはならずに親要素の要素幅(内容を置ける幅)に対する比率で統一されます。
要素幅にプロパティborder
とpadding
の値を加える仕様がIEのボックスモデルです。独自仕様で押し通したとしても要素幅の定義を無為にするため実質的には欠陥です。
加算分は内容を置けない領域ですが通常は子要素で指定が無ければバグ仕様の要素幅を最大利用するので不適合状態となります。幅設定の比率指定では水増しされた値が基準となるのでバグ加算分が大きい場合に高比率を取ると不適合状態となります。
余白設定などクラス属性.renew-margin
での指定で独自にスタイルコンテナとしている要素div
配下に表を置くと表幅は直接の親要素div
の要素幅(内容を置ける幅)を参照することになります。表幅の設定によりdiv
の要素幅の98%に表全体が収まるはずです。
IE6では親要素が変わっても子要素となる表幅を対応させず親要素の要素幅を強制的に拡張するため、上位の親要素の設定が無意味となります。先の要素幅バグ加算でも同様の処理で目先の不適合を解消しています。
よく見ると以前に取り上げた表内の文字色だけでなく文字種や大きさでも継承無視で強制設定されています。要素幅に限らず全般的に優先関係の大黒柱となる継承が出鱈目で、根幹部分の理解不足と思わせるほどの不出来です。
OSとIEが渾然一体であるため通常の使用ではスタイルシートを無効にできません。それほどCSS規格に全面依存しながら安易な処理動作を押し通す造りに、市場の寡占からくる驕(おご)りが見て取れます。