[gama]

【お使いの Snow Monkey のバージョン】14.3.2
【お使いの Snow Monkey Blocks のバージョン】 11.3.1
【お使いの Snow Monkey Editor のバージョン】5.0.6
【お使いのブラウザ】chrome
【当該サイトのURL】

いつも大変お世話になっております。

### 実現したいこと

PC表示の時とモバイルの時のロゴの表示位置を変えたい。

■カスタマイズ→デザイン→ヘッダー→ヘッダレイアウトを「中央ロゴ」
にしてあります。

モバイル時には、中央ではなく左に寄せた別の表示レイアウトにしたいと思っています。

### 試したこと

CSSにて

@media (max-width: 639px) {
  .c-site-branding__title {
    text-align: left;
  }
}

を付け加えましたが、

ここまでの左寄せになってしまいます。

モバイル時だけ、PCとは違う左に（もう少し寄せて）レイアウトをすることはできないでしょうか？
お手数をおかけいたしますが、ご回答いただけると幸いです。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

ヘッダーの HTML の構造はハンバーガーメニューが左右どちらにあってもバランスがとれるようにとか、ヘッダーコンテンツがあってもなくてもバランスがとれるように等々が考慮してあるのでかなり複雑になっています。ひとまずは下記の CSS で対応できるのではと思いますがどうでしょうか？

@media (max-width: 639px) {
  .l-center-header .c-row__col.u-invisible-wall:first-child {
    display: none;
  }
  .l-center-header .c-site-branding__title {
    text-align: left;
  }
}

♥ 2

いいねをした人:

[gama]

キタジマ 様

ありがとうございました。
上記のCSSでうまく対応ができました。

＞ヘッダーコンテンツがあってもなくてもバランスがとれるように等々

考慮してあるみたいでした。今回、ハンバーガメニューに色を載せたため、ロゴとあまり近づけたくなかったのでご無理をお願いしました。ありがとうございます。

解決いたしましたので、トピックを閉じさせていただきます。

♥ 1

いいねをした人:

[投稿者]

投稿