0

メディア クエリを使用すると、最初のセットだけが機能するように見えますが、その理由はわかりません。それらを入れ替えても、最初のものだけが機能します。max-width から min-width に変更しようとしました。and 条件を削除しようとしました。Javascript をすべて削除しようとしました。ボディ {display:none} を持つメディア クエリのみを使用して、すべての CSS を削除しようとしました。メディア クエリはスタイルシートの最後にあります。ビューポート メタは正しいです (以下を参照)。

これらの試みのどれも私の問題を修正しませんでした。なぜこれが起こっているのか誰にも分かりますか？私は @media を 100 回使用してきましたが、この問題に遭遇したことはありません。

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

@media (max-width: 740px) and (min-width: 420px) {
    .product {
        width:45% !important;
        margin:10px 10px 10px 10px !important;
    }

    .products-container select {
        width:85%;
    }   
}​

@media (max-width: 340px) {
    body {
        display:none;
    }
}​

更新 FireFox のコンソールを確認しました。私は実際に次のエラーを受け取ります: Dangling Combinator. セレクターが正しくないため、ルールセットは無視されました。

言いたいことはわかりますが、クエリの構文に問題はありません。

4

2 に答える 2

0

気にしないで、それを理解しました。

どういうわけか、CSS に隠し文字がありました。他のすべてを自分で入力したことを考えると、これは奇妙です。Dreamweaver が入力したのでしょうか? もしかしてグリッチ？とにかく、それをMS WordにコピーしてDreamweaverに貼り付け直すと修正されました.

PS ご協力ありがとうございます。

于 2013-07-30T09:22:56.813 に答える