「@mediascreenand（-webkit-min-device-pixel-ratio：0）」のセマンティクスは何ですか？
http://www.webmonkey.com/2010/02/browser-specific_css_hacks/ によると、私はたまたまWebKitベースのブラウザに以下のCSSハックを使用しました。
_@media screen and (-webkit-min-device-pixel-ratio:0) {
#my-id { height: 100%; }
}
_できます。しかし、後で私はそれが実稼働環境では機能しないことに気づきました。 CSSオプティマイザーがandの後のスペースをトリミングしていることが原因であることがわかりました。以下のCSSはChromeで認識できません。
_@media screen and(-webkit-min-device-pixel-ratio:0) {
#my-id { height: 100%; }
}
_では、@media screen and (-webkit-min-device-pixel-ratio:0)は正確にはどういう意味ですか？
私は_@media screen_を知っていますが、CSSファイルでandを使用したことはありません。
andの後のスペース文字が必要なのはなぜですか？
メディアクエリ自体は、あなたが言うように、_-webkit-_プロパティを使用するため、WebKitをフィルタリングするために使用されます。
あなたがそれが認識できないと言うとき、Chromeは単に少し厳しいです
_@media screen and(-webkit-min-device-pixel-ratio:0)
_それは実際には無効なCSSだからです。 andキーワードの後のスペースは重要です。これは CSS3メディアクエリ仕様 に明確に記載されています：
例20
以下は、「and」と式の間にスペースを入れることが許可されていないため、不正な形式のメディアクエリです。 （これは関数表記構文用に予約されています。）
_@media all and(color) { … }_
関数表記は、url()、rgb()、rgba()などを指します。ご覧のとおり、これらの例では、関数名と開き括弧の間にスペースはありません。
andは関数ではありませんが、メディアクエリが指定したメディアと一致する必要があることを示すキーワードであり、およびそのレイアウトエンジンは、その後に配置する式を満たす必要があります。 _-webkit-min-device-pixel-ratio:0_を囲む括弧は、単に式として示しています。
補遺：はい、それはあなたのCSSオプティマイザーにバグがあることを意味します;）
これは、YUIコンプレッサーの特別なコメントによる簡単な回避策です。
@media screen and/*!*/(-webkit-min-device-pixel-ratio:0) { ... }
この問題は、現在の（2.4.5）バージョンで修正されています
これのみを使用してください：
@media(-webkit-min-device-pixel-ratio:0) {
}