WordPressにてトップページの謎のスペースが消えない。

Question

トップページの謎のスペースが消えません。

上側に写っているのがムービーで、その下の白い余白が問題の余白。

Chromeの検証機能で見てみた要素がこちらです。


▼style

もしかしたら関係があるかもしれないですので、ムービー（固定フロントページ）のテーマの編集とcssも載せます。

足りない情報があれば仰ってください。よろしくお願いします。

Answer 1

僕が見た限り2箇所修正すればいいかと思います。

<div class=site siteContent style="margin-top:48px;" > のstyle="margin-top:48px;"が入っているためmargin-top: 0 !important;を追加

style.cssの.siteContentにpaddingが設定されているためそちらも削除してください

.siteContent {
  margin-top: 0 !important; //上の空きをcssで0にする
  padding: 1em 0 1.5em; //この部分を削除
}

上記の対応は<div class=site siteContent style="margin-top:48px;" >
のstyleは直接は消してませんがcssでmarginを上書きして空き幅を0にしています。

根本的にstyle="margin-top:48px;"をなくすには、外部のjavascriptかPHPで
「.site」か「.siteContent」に直接styleを当てに行っていると思うので、
「.site」もしくは「.siteContent」でファイルを全体検索して見てください。

Comments

[jo1211]

コメントありがとうございます。8-0_nyan5さんが記載してありました、<video></video>の位置を変えたらmargin-top:48px;ごとなくなりました。
.siteContent {
margin-top: 0 !important; //上の空きをcssで0にする
padding: 1em 0 1.5em; //この部分を削除
}
をすると他のページもpadding／marginなくなってしまいました。

[Higemura]

失礼しました、オレンジと緑の空き幅の削除かと思っておりました。。
実際はその上の画像部分だったんですね 笑

でしたら.siteContent のcssは必要だと思いますので削除せずそのまま使用ください。

お力になれませんでしたが、問題解決してよかったです！

[jo1211]

自分でもわかっていなくて紛らわせてしまいすいません。ありがとう御座います。

Answer 2

たぶん、固定フロントページに入れている

<video></video>

こちらの挿入場所に問題がある気がします。

Comments

[jo1211]

コメントありがとうございます。<video></video>の位置を

<?php get_header(); ?>
<?php get_template_part('module_slide'); ?>

<video autoplay="" loop="" poster="http://artbees.net/themes/jupiter-demo/wp-content/uploads/2013/10/home-vid-img.jpg" id="bgvid">
<source src="http://2017.kabufuji.com/wp-content/uploads/2017/08/pic_01.mp4" type="video/mp4">type="video/mp4">
</video>

<div class="section siteContent">
<div class="container">
<div class="row">

の場所に変更したらmargin-top:48px;ごとなくなりました。
ただ、paddingは残ったままでした。

[8-0_nyan5]

テーマは「Lightning」だと思うんですが、カスタマイズされてカルーセルとか削除されているようですし、どこにどう表示されたいのかわからなかったので、具体的なアドバイスができずすみません。

[jo1211]

「Lightning」です。無知のまま勧めてしまいまして、分かりづらくさせてすいません。ありがとう御座いました。

Answer 3

htmlソースの今ハイライトされている

<div class=site mainContent style="margin-top:48px;" >

のmargin-top:48px;
が原因じゃないのかなと思うのですが。

chromeでそのstyleを消してみたらどうですか。

Comments

[jo1211]

早速のコメントありがとうございます。8-0_nyan5さんが記載してありました、<video></video>の位置を変えたらmargin-top:48px;ごとなくなりました。