Sticky bar - hidden initially - leaving empty space before showing on Single entry blog post

[spi]

Hi,

I have one sticky bar that is hidden initially, it’s space stays empty before the bar shows up and fill the space, which creates bad looking blog entry above the featured image. How to fix this?

Thanks!

[thai]

Hi There,

Could you please provide us with your admin account so we can take a closer look?

Thanks.

[spi]

Hey,

I think the issue is clear and you can see it in the link I provided. To replicate it, just add the sticky header template that has an initially hidden bar, this template comes with PRO header builder, then use that header on the blog single entry and you’ll see the empty space, just like on my website. Check the link again. Thanks!

[lely]

Hi There,

Yes, we can see the issue. We need your credentials so we can check your bar settings. I duplicate the setup on my test site and there’s no empty space like yours. See this: https://screencast-o-matic.com/watch/cbi6ixlFij

[spi]

Hey,

Yes - it seems that the reason is not the sticky bar. I created a new one with no sticky bars and the issue persisted.

Before I give you the login info, any hint or something I can try myself to resolve this? it only happens on the blog pages.
I have custom CSS to make the blog page full width, I tried disabling this but it didn’t solve the issue. What do you suggest?

[christian]

Please add this code to your Custom CSS

.single .x-container.offset {
    margin: 0 0 20px
}

[spi]

This code has worked, amazing!

Does the blog index page look normal or do we have to remove the space under the nav bar for it as well?

Million thanks!

[nabeel]

Hi again,

You can replace the previous code with the following code:

.single .x-container.offset, .blog .x-container.offset {
    margin-top: 0;
}

Hope this helps!

[spi]

worked perfectly! thanks!

[Prasant]

Glad to hear that.