ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） - 不具合報告 https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/ Cocoon ディスカッション掲示板 ja Fri, 07 Aug 2026 10:36:32 +0000 wpForo 60 RE: ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44314 Mon, 18 Jan 2021 14:55:19 +0000 すみません、調べてて出来てしまいました。

もう少し調べてからフォーラムします。

min-height
height
にheader.inにプロパティ打ってヘッダー高さ変えるだけでした。

他の方のフォーラム解決していきます。]]> 不具合報告 kouichi https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44314 RE: ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44313 Mon, 18 Jan 2021 14:29:28 +0000 kouichi さん

投稿者:: @kouichi

原因が分からないため教えて頂きたいと思います。

kouichi さんでしたら、調べればわかるはずです。

]]> 不具合報告 リフィトリー https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44313 RE: ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44310 Mon, 18 Jan 2021 14:02:42 +0000 kouichi さん

画面幅834px以下は以下の方がいいかもしれません。

@media screen and (max-width:834px) {
  .header div.header-in {
    min-height: auto;
    height: 55vw;
  }
}

 

]]> 不具合報告 リフィトリー https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44310 RE: ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44308 Mon, 18 Jan 2021 13:39:34 +0000 kouichi さん

たぶん、要らないと思いますが、上記のコードだけではスマホ表示でヘッダーの高さが足りないときは、以下を足してみてください。

@media screen and (max-width:834px) {
  .header div.header-in {
    min-height:350px
  }
}

 

]]> 不具合報告 リフィトリー https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44308 RE: ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44307 Mon, 18 Jan 2021 13:33:05 +0000 kouichi さん

余白はサファリに限ったことではないみたいです。

 

]]> 不具合報告 リフィトリー https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44307 RE: ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44306 Mon, 18 Jan 2021 13:22:41 +0000 前略、kouichi さん

以下のコードだと、どうなりますでしょうか？

.header .header-in {
  min-height: auto;
  height: 29.39vw;
}

これだけで、足りないときは、ちょっとまた、足すかもしれません。

]]> 不具合報告 リフィトリー https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44306 ヘッダー下に余白がでてしまう。（クロームは大丈夫、サファリが余白がでてしまう） https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44305 Mon, 18 Jan 2021 12:57:34 +0000 ---------------------------------------------- サイト名： サイトURL：https://bodogeholiday.com ホームURL：https://bodogeholiday.com コンテンツURL：/wp-content インクルードURL：/wp-includes/ テンプレートURL：/wp-content/themes/cocoon-master スタイルシートURL：/wp-content/themes/cocoon-child-master 親テーマスタイル：/wp-content/themes/cocoon-master/style.css 子テーマスタイル：/wp-content/themes/cocoon-child-master/style.css WordPressバージョン：5.6 PHPバージョン：7.4.13 ブラウザ：Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.141 Safari/537.36 サーバーソフト：Apache サーバープロトコル：HTTP/1.1 言語：ja,en-US;q=0.9,en;q=0.8 ---------------------------------------------- テーマ名：Cocoon バージョン：2.2.5.3 カテゴリ数：4 タグ数：0 ユーザー数：1 ---------------------------------------------- 子テーマ名：Cocoon Child バージョン：1.1.2 style.cssサイズ：847バイト functions.phpサイズ：203バイト ---------------------------------------------- Gutenberg：1 AMP：0 PWA：0 Font Awesome：5 Auto Post Thumbnail：0 Retina：0 ホームイメージ：http://bodogeholiday.com/wp-content/themes/cocoon-master/screenshot.jpg ---------------------------------------------- ブラウザキャッシュ有効化：1 HTML縮小化：0 CSS縮小化：0 JavaScript縮小化：0 Lazy Load：0 WEBフォントLazy Load：0 ---------------------------------------------- 利用中のプラグイン： Advanced Editor Tools (previously TinyMCE Advanced) 5.6.0 Classic Editor 1.6 Contact Form 7 5.3.2 Really Simple SSL 4.0.5 Wp Posts Carousel 1.3.7 Yoast Duplicate Post 3.2.6 ---------------------------------------------- 高速化は無効にしました。

https://bodogeholiday.com

クロームは余白は出ないのですが、サファリだとどうしても余白がでてしまい、アピールエリアも非表示でカルーセルも非表示にして、キャッシュもクリアしてるのですが、直らなく何故なんでしょうか？
ヘッダーに問題あるんでしょうか？
サイズは1900×600で作成しているのですが、メニューバーに問題か。
すみません、原因が分からないため教えて頂きたいと思います。
]]> 不具合報告 kouichi https://wp-cocoon.com/community/bugs/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e4%b8%8b%e3%81%ab%e4%bd%99%e7%99%bd%e3%81%8c%e3%81%a7%e3%81%a6%e3%81%97%e3%81%be%e3%81%86%e3%80%82%ef%bc%88%e3%82%af%e3%83%ad%e3%83%bc%e3%83%a0%e3%81%af%e5%a4%a7/#post-44305