SafariブラウザのみをCSSハックする方法

サイバーマンデー
Amazonプライム会員限定の大セール「サイバーマンデー」開催中!プライム会員限定の大セール

Safari

昨日.自作のWordpressテーマの表示がSafariだけおかしいという不具合報告をいただきました。

で調べてみたら、以下のような感じで、どうやら不具合はSafariだけのようでした。

  • Chrome→OK
  • Firefox→OK
  • IE→OK
  • Opera→OK
  • Safari→NG

それで、CSSハックでSafariだけに適用されるスタイルを設定しようと思ったのですが、日本語では思ったように見つかりませんでした。

バージョンの古いものなら結構あったのですが、適用してもうまく反映しなかったり、ChromeとSafari抱き合わせのCSSハックだったり。

それで、英語サイトも探してみたら、以下のページで見つけることができました。

is there a css hack for safari only NOT chrome? – Stack Overflow

以下がSafariのみに適用されるスタイルの記述方法です。

とりあえず僕は、Windows環境しか持っていないのでWindows版Safari5.1.7(追記:現代では配布終了)では動作確認しました。

その他の以下のブラウザで、上記のスタイルが適応されないのも確認しました。

  • Chrome37.0
  • Firefox32.01
  • Opera24.0
  • Internet Explorer11.0

もし、Safariだけ表示がおかしいという場合は、試してみてください。

スポンサーリンク
レクタングル(大)広告