この記事はアピリッツの技術ブログ「DoRuby」から移行した記事です。情報が古い可能性がありますのでご注意ください。
こんにちは。maiです。
web標準化の波のおかげで、時代はcssレイアウト。
でもcssってブラウザごとにズレたりするのが困りものですよね。
そんなときにブラウザを限定してcssを適用するハックをご紹介します。
ちなみに、Firefoxが一番仕様に近い動作をするので、
cssを書くときはまずFirefoxで確認しながら書きます。
そのためFirefox向けのハックは基本やりません。
■ Safari向け
html*セレクタ { /* for safari */ プロパティ:値; }
Safari 2.x系
html:first-child セレクタ { /* for safari2.0 */ プロパティ:値; }
■ IE向け
IE6
* html セレクタ { /* for ie6 */ プロパティ:値; }
IE7
*:first-child+html セレクタ { /* for ie7 */ プロパティ:値; }
記述する順番は以下の通り。
1.Firefoxに適用するデフォルトの指定
2.Safariに適用する指定→Safari2に適用する指定
3.IEに適用する指定（順番はどっちでも）
IE系はどっちも同じ指定をすることが多いですが、
* html セレクタ, *:first-child+html セレクタ { /* for ie */ プロパティ:値; }
という書き方はできないので注意です。
