[CSS]ブラウザによって表示を変える

InternetExplorerとそれ以外のブラウザでは表示が異なるスタイルシート記述方法です。

まず、HTMLを以下のように記述。

<!--[if IE]><div id="ie"><![endif]-->
<!--[if !IE]><div id="not"><![endif]-->
<div class="waku">
テスト
</div>
</div>


次はスタイルシートで、

#ie .waku{width:500px;border:1px solid black;}
#not .waku{width:550px;border:1px solid red;}

それぞれ定義します。
#ieで指定したものはIEのみの表示、#notはそれ以外のブラウザでの表示となります。


[tmkm-amazon]4883375412[/tmkm-amazon]