CSSのプルダウンメニューがIE8でうまく動かない

  • このエントリーをはてなブックマークに追加

JavaScriptを使わずにCSSだけでプルダウンメニューを実装しようと試みてみる。

すると、FireFoxやChromeでは問題なく表示されるものの、IE8でうまく動かない。。。

またか、IEよ。

まいったなーと思いつつ、ネットで調べてみると、
な、な、なんと li:hover がIE8では使えないとのこと。

しかし、普段はまったく気にしていなかった「ドキュメントタイプ」を「標準準拠モード」にすると使える!!

なるほどなるほど。HTMLのドキュメントタイプには標準モードと互換モードがあると。
しかも標準モードには厳格な「Strict」と、緩い「Transitional」があると。

最新のブラウザでは標準モードで書いたページの方がHTMLのDOCTYPEスイッチに従って正確に表示されることが多く、また異なるブラウザで閲覧してもレイアウトが統一されることが多いようです。互換モードを起動させないDOCTYPE宣言文を選択した方が賢明といえます。

<参考>標準モードと互換モードについて:HTMLタグ辞典 – HTMLタグボード

今回宣言した(緩い)標準準拠モードの記述はこちら。

勉強になりました。


サブコンテンツ