WordPressテーマSANGOの質問

スマホのヘッダーロゴ表示を100%にしたい。

アバター
aa

初歩的な質問ですみません。
スマホで見た時にヘッダーロゴを画面横いっぱいにしたいです。
widthを指定したり、100%にしたり、 object-fit: contain;を消したり色々と試してみましたがダメでした。
具体的なcssの記述例をご教示いただけませんでしょうか。

よろしくお願いします。

タイトルとロゴの設定
ブログのタイトルとロゴ画像を設定しよう
コメントへの回答
サルワカくん
サルワカくん
2020/05/16

お世話になっております。
ヘッダーのロゴ画像を横いっぱいに表示するカスタマイズが該当すると思います。
スマホでだけ適用したいCSSがある場合、以下のように書けばOKです。

@media only screen and (max-width: 481px) {
  /* ここにCSSを書く */
}

よろしくお願いいたします。

サルワカくん
サルワカくん
2020/05/17

スレッドの数をなるべく増やしたくないので、同トピックについてのコメントは新規作成するのではなく返信する形でお願いします。

度々恐れ入ります。
chromeの検証モードを使用し、marginが発生している要素を調べ、.inner-headerやh1#logo.h1.dfontにmargin: 0を指定してみましたがヘッダーメニューとの余白が0になりません。

どのような命名規則であれば余白をなくせますでしょうか。
お手数ですがよろしくお願いします。

→ 画像周りの余白も消すようなCSSをヘッダーのロゴ画像を横いっぱいに表示するカスタマイズで紹介しています。
.header--center #logo { padding: 0; }の部分です)

よろしくお願いします。