Banner Leaves Gap In Menu When Scrolling

Hi @mariannelynnh if you set the banner as fixed you are also going to need to apply css to the sites header in the Custom Site CSS section:

header {
    top: 45px;
}

I am having the same problem.

When I add the simple banner it creates a gap when I scroll down, between the sticky header menu and the top of the page. Is there any way to get rid of this gap?

• This reply was modified 5 years, 2 months ago by markodinho.

Did you add the css recommended by the plugin author? That seems to have worked. Although, I had to play with the number to get it to work on my site.

Hi thanks for the reply,

I did that yes.That stopped the banner from blocking my header.

However that also caused the gap to appear. I see that on the site you posted you also have a small gap between the menu and the top of the page when you scroll down. I’m assuming you did that deliberately but for me there is a much larger gap I would like to reduce or get rid of.

I have a screenshot here of when I scroll down: https://paste.pics/a06d1a790569fd37460c6290f20a4f08

Yeah, I’m having that same issue. My client doesn’t seem to care. I would try to get in touch with the developer again about it.

@markodinho In this case you’re going to have to use the not css selector. When you scroll the javascript for your theme most likely adds a css class to your header to make it scroll along with you as you go down the page. For example, for @mariannelynnh , if you adjust the css to this it should fix your issue:

header:not(.menu-scroll-bg) {
  top: 45px;
}

• This reply was modified 5 years, 2 months ago by rpetersen29.

That didn’t seem to work.

Sorry, looks like your theme changed a bit. This should work if the goal is to have the banner hug the top of the page.

header.site-header.menu-scroll-bg {
    top: 0;
}

It worked! Thank you!

That didn’t work for me unfortunately

@markodinho It’s not going to work for you, you have a different site so the same css classes don’t apply. I’m not going to be able to help you until your website is published and i can take a look at the HTML