メディアクエリで幅が有効にならないのはなぜですか？

Question

以前はこの問題に遭遇したことはありませんでしたが、何らかの理由でメディアクエリの幅を変更できません。デベロッパーツールでは、幅が表示されないように切り替えたように横幅が表示されていますが、そうではありません。デフォルトで表示されます。 、私もdiv.wrapperに私のメディアクエリwrapperクラスを変更しようとしている

.wrapper { 
    width: 95%; 
    margin: 0 2.5%; 
} 

...しかし、それは助けにはならなかった。この中

div.wrapper{ 
    display:block; 
    width:100%; 
} 

：

私はこれを変更しようとしてシンプルです

この原因は何ですか？

メディアクエリで

Answer 1

をCSSで、我々はattribute.classname（div.wrapper）のような要素を呼び出す場合、それはより多くの優先順位を持つことになります.classname（.wrapper）を呼び出します。

これを解決する方法は2つあります。

1. 呼び出しメソッドを変更します（main-cssとmedia-queryと同じ呼び出し方法を使用します）。

2. これ以外の場合、.wrapperの幅の後に '！important'という付加的なプロパティを指定します。

   。ラッパー{ 幅：95％！重要; マージン：0 2.5％; }

Answer 2

は、以前よりも同じ定義を使用します。

div.wrapper { 
    width: 95%; 
} 

Answer 3

私はあなたがこの記事を読んですべきだと思う： CSS: Understanding the selector's priority/specificity

あなたはCSSルールを使用する際の優先順位があります。例えば

、.column .sponsorsがあなたの.column .sponsors問題に関してはちょうど.sponsors

Answer 4

上の優先順位を持つことになります、あなたは同じことを行う必要があります。

@media screen and (max-width: 640px) 
{ 
    .column .sponsors { 
     width: 90%; 
    } 
} 

これは.column宣言を変更しません。