Internet Exporer 6以前と、それ以外でスタイルを分ける

■動作ブラウザ　【 IE:4.0　 NN:4.0　 Safari:1.0】　■CSSバージョン【-】
Internet Explorer Netscape Navigator iCab Safari
3.0x 4.0x 4.5 5.0x 5.5 6.0 2.0x 3.0x 4.0x 4.x 6.0 7.0 2.x 1.x
Windows × ○ - ○ ○ ○ × × ○ ○ ○ ○ - -
Macintosh × × × ○ - - × × ○ ○ ○ ○ ○ ○
UNIX - - - - - - × × ○ ○ ○ ○ - -

ポイント WinIE5も含む全てのブラウザでのスタイル定義
プロパティ名に\を入れて値を定義（ここはIE5は無視される）
説　　明 Internet Explorer 6以前、つまりInternet Explorer 5.xではwidth、heightなどの幅の解釈が他のブラウザと異なります。このためWin+IE5とそれ以外でスタイルを分ける必要が出てきます。このような場合にはスタイル名に\（円記号またはバックスラッシュ）を入れることで切り分けることができます。widthであればw\idth、wi\dth、wid\th、widt\hのいずれかになります。先頭や末尾に\を指定してしまうと、うまくいかないので注意が必要です。
サンプル <html>
<head>
<title>Win+IE5対策</title>
<style type="text/css"><!--
.type1 { margin:10px;
padding:15px;
border:5px red solid;
width:400px;
}
.type2 { margin:10px;
padding:15px;
border:5px red solid;
width:400px;
w\idth:440px;
}
--></style>
</head>
<body>
<div class="type1">
このdivタグの回りにはマージン10pxと枠5px、パディング15pxがあります。しかし、Windows版のInternet Explorer 5.xでは横幅の解釈が異なるため、他のブラウザとは異なる幅になってしまいます。（ここは未処理）
</div>
<div class="type2">
このdivタグの回りにはマージン10pxと枠5px、パディング15pxがあります。しかし、Windows版のInternet Explorer 5.xでは横幅の解釈が異なるため、他のブラウザとは異なる幅になってしまいます。（ここは処理済み）
</div>
</body>
</html>
補足説明 Mac+iCab 2.9.xではレイアウトが崩れることがあります。Mac+Opera 7.5、Mac+IE5.2、Win+IE6ではHTMLのTransitionalかStrictかによって結果が異なります。期待通りに表示するにはHTML 4.01 Strictを指定してから使用してください。

■サンプルを実行する(無指定：Transitional)　>>実行
■サンプルを実行する(4.01 Strict)　>>実行
 ■各ブラウザでの動作結果を見る　>>View!