私のWordpressテーマのサイトロゴではメディアクエリが機能しません

Question

私はSpaciousというWordPressテーマを使用しています。私はサイトロゴを設定しましたが、ロゴを反応させるように見えません。ロゴは特定のメディアクエリにのみ応答しますが、モバイル画面サイズには対応しません。

サイトロゴの位置を、ヘッダーの下の中央から左側のヘッダーに変更しました。私はこれが問題かもしれないと思うが、私は確信していない。私は何か間違っているのですか？私のロゴを反応的にする方法は？私のサイトへのリンクは：davenport.ryannemurphy.comです。私はロゴを使用していますCSSのコードは以下の通りです：

@media only screen and (max-width: 600px) { 
.custom-logo {margin-top: 25px; 
position: absolute;} 

@media only screen and (max-width: 768px) {.header-image {height: 100px;} 


.custom-logo {width: 50%; 
margin-top: -20px; 
} 
} 


@media only screen and (max-width: 900px) { 


.custom-logo {width: 50%; 
position: relative;} 
} 

@media only screen and (max-width: 1100px){ 

.custom-logo {width: 50%; 
margin-top: -20px; 
position: relative; 
} 


} 


@media only screen and (max-width: 1500px){.custom-logo{margin-left: 100px;}} 

@media only screen and (max-width: 1650px){.custom-logo {margin: 30px; }} 

@media only screen (min-width: 1651px) and (max-width: 1850px){.custom-logo {width: 90%;}} 


@media only screen and (max-width: 1950px){ 
.custom-logo {margin-left: -100px; 
margin-top: -98px; 
position: absolute;} 
} 

Answer 1

私はあなたが添付CSSで3行目では閉じ括弧を（「}」）が欠落していると信じています。

CSSコードをフォーマットするには、オンラインのCSSフォーマッタ（たとえば、https://www.cleancss.com/css-beautify/）を使用します。実際には、その中かっこがないため、ほとんどのメディアクエリが階層内の最初のものよりも下に表示されます。

これは問題を引き起こしているのかどうかはわかりませんが、ブラウザを混乱させる可能性があり、バグを引き起こす可能性があります。

Answer 2

img width = "450" height = "92" ... />がHTMLにハードコードされています。私はあなたがimgタグの高さと幅の属性を削除する必要があると思う。