IE11のみにCSSを効かせる方法(CSSハック)

どうもユーキです。

サイト制作をしているときにIE11だけ崩れちゃってることって結構ありますよね。
そんなときには、CSSハックという特定のブラウザのみに反映できるテクニックがあります。
今回はIE11のみに効かせる方法を紹介します。

CSSの指定方法

@media screen and (-ms-high-contrast: none) {
  *::-ms-backdrop, .text { color: red; }
}

これだけです。

上記のメディアクエリで囲んで(screenのところはallとかに変えても大丈夫です)、CSSを効かせたいclassやIDの前に*::-ms-backdrop, をつければOKです。簡単ですね。

ちなみに *::-ms-backdrop, この部分を消せばIE10にも効くようです。
まぁいまどき対象ブラウザ外だと思うので、あまり気にしなくてもいいかもですね。

CSSハックはSEOにあまり良くないとかなんとか。
使わないに越したことは無いとおもいますが、IE11だけ崩れる際は使ってみてはいかがでしょうか?

About Me

プロフィール画像

ユーキと申します。北海道恵庭市という札幌と新千歳空港の間でフリーランスのWebエンジニアとして活動してます。

当サイトのブログでは、主にWeb制作全般、フリーランス周りの情報など色々なノウハウや知識を載せています。
その他日々気になったこと、思ったことも書いてます。

お仕事の相談など何かありましたら、お問い合わせかツイッターのDMからお気軽にご連絡くださいませ。

お問い合わせはこちら

ツイッターはこちら

ポートフォリオはこちら

Latest Posts

Popular Posts

TOP