IEが小さいデバイス支配CSSメディアクエリ

Question

IE 6-7-8を（DUNNO 9）メディアルールに関係なく、このCSSを実行..

<link rel="stylesheet" type="text/css" media="only screen and (max-width: 680px), only screen and (max-device-width: 680px)" href="styles/small-device.css" /> 

これがOKで実行：

<link rel="stylesheet" type="text/css" media="only screen and (max-width: 680px)" href="styles/small-device.css" /> 

なぜですか？頭で

私はこれを持っている：

<meta name="viewport" content="width=device-width,initial-scale=1"> 

Answer 1

このメディアクエリーが完全にIEと（ノーサポートですべてを持っていない）、特にIE6でサポートされていないCSS3の機能であるので、それはあります。

ブラウザのスニッフィングを使用して条件付きリソースを読み込む必要があります。 IE6,7,8は小さなデバイスでは使用されないので、両方を組み合わせることができます。 IE9は、更新

<!--[if lte IE 8]> 
<style type="text/css" media="screen"/> 

<![endif]--> 
<!--[if !(lte IE 8)]> 
<style type="text/css" media="screen and (min-device-width: 450px)"/> 

<![endif]--> 

http://www.akademy.co.uk/blog/2010/03/css-style-ie6-media-hack/

WP7

に使用されている：私は何を提案することは、彼らが小さな画面のデバイス上で使用できないため、すべてのIEのために安全、非小画面のCSSを使用しても安全であるということです。

サイズ変更されたブラウザで使用する場合は、CSSでjscript（動的プロパティ）を使用しない限り、IEではできません。例：

div { 
    min-height: 300px; 

    /* simulates min-height in IE6 */ 
    _height: expression(document.body.clientHeight < 300 ? "300px" : "auto"); 
}