[辻脇由喜子]

【お使いの Snow Monkey のバージョン】2024/02/18購入分
【お使いの Snow Monkey Blocks のバージョン】バージョン 20.4.3
【お使いの Snow Monkey Editor のバージョン】バージョン 9.3.3
【お使いのブラウザ】マイクロソフトエッジ
【当該サイトのURL】ローカルで作成中　 test.local/wp-admin/plugins.php

### 実現したいこと：トップページ　メニューバー　と　すぐ下の画像　の余白を消したい

### 発生している問題：トップページのメニューバー　と　すぐ下の画像　に大きな余白が出ている

### 試したこと

カスタマイズ＞デザイン＞基本デザイン設定　で　デフォルトページヘッダー画像登録をしたら　全画像が入らず、上下・左右が切れてしまうので、固定ページで画像挿入、フル画面にして　トップページヘッダー画像としています。

画像はそのまま入っていますが、メニューバーと画像の上の間に結構な大きさの空白が生じています。

カスタマイズ＞ホームページ設定　でホームページのコンテンツエリアに上下余白を追加する　のチェックは外しています

♥ 0

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

[キタジマ タカシ]

デフォルトページヘッダー画像登録をしたら　全画像が入らず、上下・左右が切れてしまうので、

ページヘッダー画像は、どのような画像（縦長等）がきてもある程度それなりに表示するために、高さの制御がされており、はみでる部分はトリミングされるようになっています。CSS を追加することで高さの制御とトリミングを無効化できます。

.c-page-header[data-has-image=true] {
    height: auto;
    padding: 0;
}

.c-page-header[data-has-image=true] .c-page-header__bgimage,
.c-page-header[data-has-image=true] .c-page-header__bgimage > picture {
    position: static;
}

.c-page-header[data-has-image=true] .c-page-header__bgimage > img,
.c-page-header[data-has-image=true] .c-page-header__bgimage > picture > img {
    position: static;
    height: auto;
}

ページヘッダー画像を使わない場合は↑は入れなくて大丈夫です。

固定ページで画像挿入、フル画面にして　トップページヘッダー画像としています。

画像はそのまま入っていますが、メニューバーと画像の上の間に結構な大きさの空白が生じています。

レイアウトまわりがどのような設定になっているかで変わってくるので、実際に見てみないと正しい答えを提示できるかわからないのですが、とりあえず、下記の CSS を試してみると良いかもしれません。

.l-contents__inner {
  padding-top: 0;
}

♥ 1

いいねをした人:

[辻脇由喜子]

早速のご対応ありがとうございました。

ヘッダー画像を　無事にキレイに　入れることができました。

そして、空白もなくなりました。

ヘッダー画像にかなり悩まされ、しかたなく、固定ページの画像挿入に至りましたので、大変助かりました。

ありがとうございました。

♥ 1

いいねをした人:

[投稿者]

投稿