[Resolved] White space in between navigation menu bar and content widget

[Rachel]

Hi,

I have been trying to fix the white space I had in between navigation menu bar and content widget on my site, but none of the codes work. (http://www.finkelsteinfinancial.com)

I have tried the following codes, but it applied to all my pages. I would like to just lose the white space on the homepage and no changes on other subpages.
.separate-containers .inside-article {
padding-top:0;
margin-top:-2em;
}
.separate-containers .site-main {
margin-top:0;
}

[Leo]

Hi Rachel,

You were really close! Try the CSS below.
If you add the code in the Simple CSS metabox in this page then it will only apply to this page.

.separate-containers .site-main, .entry-content {
    margin-top: 0px;
}
.separate-containers .inside-article {
    padding-top: 0px;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Let me know.

[Rachel]

Thanks Leo! It work perfectly!

[Leo]

You’re welcome 🙂

[Rachel]

Hi Leo,

I wanna do the same thing for all the subpages – hide the page title and replaced by a full size image. Which CSS code I should add on the pages? (www.finkelsteinfinancial.com/about)

I have tried the following based on what you have given above, but there is a white space showing in between navigation menu bar and widget again. Please advise.

.separate-containers .entry-content {
margin-top: 0px;
}
.separate-containers .inside-article {
padding-top: 0px;
}

@media screen and (min-width: 61.5625em) {
.entry-title {display: none;}
}

[Leo]

You can hide the page titles using Disable Element: https://docs.generatepress.com/article/disable-elements-overview/

That white space can be removed with this CSS:

.separate-containers .site-main {
    margin-top: 0px;
}

Let me know.

[Rachel]

Awesome! Thank you

[Leo]

You’re welcome!

[Author]

Posts