IE7 は、メディア クエリに含まれているかどうかに関係なく、css のすべてのスタイルをスキャンしています。IE7/8 はメディア クエリを無視すると思いました。それらを無視しているわけではありません。非常に奇妙な。
解決策を探してみましたが、IE7 でメディア クエリが実際に動作するようにハッキングする方法しか見つかりませんでした。
IE7 で読み込まれないメディア クエリ用に別の css ファイルを作成するのが最善の方法でしょうか?
どんな助けでも大歓迎です。
IE7 は、メディア クエリに含まれているかどうかに関係なく、css のすべてのスタイルをスキャンしています。IE7/8 はメディア クエリを無視すると思いました。それらを無視しているわけではありません。非常に奇妙な。
解決策を探してみましたが、IE7 でメディア クエリが実際に動作するようにハッキングする方法しか見つかりませんでした。
IE7 で読み込まれないメディア クエリ用に別の css ファイルを作成するのが最善の方法でしょうか?
どんな助けでも大歓迎です。
私は同じ問題を抱えています。IE7 はメディア クエリを無視しないので、私が考えた 2 つの解決策がありますが、もっと洗練された解決策があればいいのにと思います。
1) すべてのクエリをページの上部に配置して、最後のデフォルトの外観が優先されるようにします。残念ながら、たとえば画面サイズに応じてスタイルをオーバーライドする場合は、メディア クエリを一番下に配置する必要があります。
2) IE 固有のスタイルシート (メインのスタイルシートの後に読み込まれる) を使用して IE7 のスタイルをリセットします。私がこれに使用している方法は、Boilerplate (具体的にはここの Wordpress の Boilerplate テーマ: http://wordpress.org/extend/themes/boilerplate )から取得したものです。
<!--[if lt IE 7 ]><html class="no-js ie ie6 lte7 lte8 lte9"><![endif]-->
<!--[if IE 7 ]><html class="no-js ie ie7 lte7 lte8 lte9"><![endif]-->
<!--[if IE 8 ]><html class="no-js ie ie8 lte8 lte9"><![endif]-->
<!--[if IE 9 ]><html class="no-js ie ie9 lte9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html class="no-js"><!--<![endif]-->
これにより、IE ブラウザーをターゲットにすることができ、スタイルを独自のスタイルシート (他のブラウザーがまったくロードしないようにする) または通常のスタイルシートの最後に配置できます。
html.ie7 div {}
等。
どちらの方法もあまり優雅ではありません... このがらくたが、私が Internet Explorer を嫌いな理由です。(私のサイトがまだ IE7 と IE6 のユーザーからアクセスされていると思いますか? IE6 のユーザーには残念ですが、互換性をチェックすることさえ気にしません。)
IE で CSS3 メディア クエリをサポートするための JS ライブラリがあります。