ここから2009年3月11日、書き直し

CSSを習得する上で、誰もが通る道ではないでしょうか？

「IE6だけレイアウトが崩れる〜！」

こういった場合、widthのとpadding、widthとborderの値を見直すことで、ほぼ対処できます。

標準準拠モードと後方互換モード

ブラウザに表示される内容は、標準準拠モードと後方互換モードがあります。

標準準拠モード（W3Cに準拠している）

モダンブラウザ

後方互換モード

IE5以前のIEや現在サポートされていないブラウザ

標準準拠モードか後方互換モードで、widthの値が変わります。

上図のように、後方互換モードでは、「width」は「padding」と「border」を合計した値となり、W3Cに準拠していません。

CSSの理解を妨げるIE6

実は、IE6は「標準準拠モード」でも「後方互換モード」であります。
というのは、xhtml文書ではファイルの先頭にxml宣言を記述しますが、xml宣言は必須ではありません。
そして、xml宣言があるかないかで、「後方互換モード」だったり「標準準拠モード」だったりするのです。

このため、xhtml文書でもxml宣言をしない作り方がポピュラーでありました。
ただ昨今、CSSが普及し、正しい理解が浸透してくると、本来の意味（xml文書として取り扱う）でxml宣言をするサイトが増えてきています。

標準準拠モードと後方互換モードに依存しない制作

個人的には、標準準拠モードであろうが、後方互換モードであろうが、それを意識することなくCSSを記述するようにしています。

• 同じ要素に、「widthとpadding」もしくは「widthとborder」を設定しない

これを徹底することで、もうIE6だろうがなかろうが、xml宣言があろうがなかろうが、なんら心配する必要はないのです。

最後に、どうしてもIE6以下にだけ適用させたいCSSがあるときは、「* html 」を付けて記述することで対応できます。

p{
font-size:16px;
}
* html p{ /*IE6以下にのみ適用される*/
font-size:12px;
}

何かお困りではありませんか？