firefoxのみに効くCSSハック
ページを作っていて、どーしてもfirefoxでだけ1ピクセルずれる減少に悩まされ、firefoxだけに適用されるCSSハックを探したのですが、これが意外とありませんでした。
「:-moz-broken」などのfirefoxでしか使えない"独自実装擬似クラス"をセレクタに混ぜ込むことによってfirefoxでしか適用されないCSSを定義するという記事もありました。
div#menu, x:-moz-any-link { STYLE }
しかしこれがIE7にもどうやら適用されてしまうようなのです。
そこで、最初にfirefoxのスタイルを書き、さらにそれ以外のブラウザのスタイルを書くことで何とか解決しました。
SELECTOR { STYLE }/*firefox用*/
*:first-child+html SELECTOR { STYLE }/*IE7用*/
* html SELECTOR { STYLE } /*〜IE6用*/
body:first-of-type SELECTOR { STYLE }/*Safari and Opera用*/
うーん、こんなのでいいのかしら(^.^;)
でもこれで
Windows IE6、IE7、Opera9.6、Firefox3
Mac Firefox3、Safari3
では大丈夫でした。
2009年1月15日 |
固定リンク
|
カテゴリー : CSS
|
コメント [0]
|
トラックバック [0]
|
Main|
↑ページトップ|
