white space under single post page [only on mobile]

Hi Liza,

There are 2 things that adds the space.

First is the Post navigation added through a Block element. The container block that contains the navigation buttons has a margin bottom for the desktop view that also is being cascaded to mobile. Make sure to remove this margin-bottom on mobile view.

The second one is the empty sidebars. I see you have them enabled on single post pages but they're empty. You can completely remove this from render by creating a Layout Element.
https://docs.generatepress.com/article/layout-element-overview/

On the newly created layout element, go to its sidebar tab - https://docs.generatepress.com/article/layout-element-overview/#sidebar - and set it to Content (no sidebars).

You then set the display rule location to "Posts - All posts" and save the layout element. This should effectively remove the 2nd half of the white space

Hi,

Thanks..I managed to remove the 2nd half of the white space but not the space on top of it. I don't know exactly where to edit it. I tried to remove the margin-bottom in the post navigation block section but there seems to be no option to do so...thanks in advance!

Ah it may not be assigned there.

Your site has this CSS:

.sidebar .widget, .page-header, .widget-area .main-navigation, .site-main>* {
    margin-bottom: 51px;
}

It seems like a custom CSS but I can't verify where its added as it is masked by autoptimize.

Once you find it, modify it to this:

.sidebar .widget, .page-header, .widget-area .main-navigation, .site-main>*:not(.featured-navigation) {
    margin-bottom: 51px;
}

You may also have to remove the empty Paragraph block on the Block element responsible for the Post navigation.

Go to Appearance > Elements and look for the Block element for Post navigation.

Open the Block element and check the page using List view.

You should see a paragraph block. Delete it to remove the extra space it adds.

Hi Vin,

I could not find it either..it's nowhere to be found. Could it be that it's lurking in the theme editor ;=) Concerning the paragraph block--I did check the page using the list view but there is no option to remove it...TIA

Hi there,

you need to select the Text block in the editor and then hit Backspace Delete to remove it

Hi,

I remove it using the backspace key but the white space is still visible both on mobile and desktop. Thanks

Hi Lisa,

It seems you have 55px bottom margin applied on the site container.
https://www.screencast.com/t/R8G74Sdx9G

Can you disable your cache plugin so I can see where the CSS is coming from?

Let me know :)

Hi,

I already disabled the cache plugin...

If you want NO space at the bottom of the post ie. below the Next / Previous post section then add this CSS to remove that just on the single post:

.single-post.separate-containers .site-main {
    margin-bottom: 0;
}

Thanks, David!

You're welcome