Edgeだけ形が崩れてしまったりする場合の対処法-CSS編IEはホームページを制作する側からすると迷惑以外なにものでもない。いえ、無視し続けるわけにもいかないので、しぶしぶ対応するしかない。IEに対してちゃんと動いたり表示されたりするようにする事をIEハックと言ったりするが、今回はCSSでIEハックする方法を5つ紹介。JavaScriptを使ってIEハックする方法もあるが、今回はより簡単なCSSの方法を紹介。リスト表示のされかたの違いを例に。下に5px空白となる。この場合はCSSを書く順番が重要。下に書いてしまったりすると全て5pxに統一されてしまう。CSSは上から下に読み込むのが原則なので、注意したい。ターゲット擬似クラスと呼ばれ、本来は、リンクをクリックしたら、移動先のCSSを書き換えたりするものだ。IEだけ対応していないので、これを逆に利用する。本来の意味は、Webの表示にハイコントラストモードを使っているかの判定を行う。マイクロソフト(つまりIE)のハイコントラストモードを判定している。IEの場合だけCSSを読み込ませる。-moz-high-contrasなどでFireFoxのハイコントラストモードを判定することも可能。HTMLの条件分岐で違うCSSを読み込ませる方法CSSでなく、HTMLに書く方法。*/}</style><![endif]–>HTMLの条件分岐で、IE6やIE9以下でない場合はコメントアウトされ、IEの時にはスタイルシートを読み込む。「10よりも下」なのでIE9以下。HTMLのmetaタグで、ブラウザの仕様を強制的に統一する方法<head>内にmetaタグでブラウザの仕様を統一することができる。CSSファイルやjsファイルの読み込みよりも上に記述する必要がある。(CSSフィイルを読み込んだ後でブラウザ仕様を統一しても意味がない。content="IE=9">これで、IE9以上を全てIE9モードで表示。7ではIE6モードで表示される。厳密に言うと全て「間違ったCSS記述法」であり、ブラウザの対応非対応を利用した方法だ。今後、IE12やIEの最新版が出てきた時にどのような動きになるか読めないのが嫌なところだ。明日試したくなるカスタマイズ、ネットな日々に役立つ小技と、たまに旅行の妄想と。