[Support request] Weird empty bar or box above top menu

[Evan]

There’s a strange empty box or white bar that appears above my header menu on desktop and I can’t seem to figure out how to get rid of it.

Any ideas?

[Leo]

Hi there,

Can you do this first so I can take a closer look?
https://www.screencast.com/t/peBCIqyH

[Evan]

Just cleared and disabled my caching plugin Leo.

Thanks!

[Leo]

I’m seeing this CSS that’s causing the issue:

.menu {
    background: #fff;
    border: 1px solid #c0ccda;
    border-radius: 3px;
    list-style: none;
    margin: 0;
    max-width: 100vw;
    min-width: 100%;
    padding: calc(.5rem - 1px) 0;
}

If you didn’t add that then try disabling all plugins except GP Premium.

[Evan]

Thanks Leo.

I wonder if it could be Elementor doing that. It doesn’t show on every page.

If I turn off Elementor temporarily will I permanently lose my designs or will they come back once I turn the plugin back on? Sorry if that’s beyond your scope, I just don’t want to break anything while trying to get rid of that bar.

[David]

The CSS is coming from Send In Blue – not something you can edit as its coming from another server. You may want to report it to them as its bad practice for them to install very generic CSS – it should be specific to their code requirements

Try adding this CSS to overwrite it:

.main-navigation ul.menu {
    border: none;
    padding: 0;
    width: unset;
    max-width: unset;
}

Not required now but in regards to disabling Elementor – you won’t lose anything by disabling it and re-enabling it.

[Evan]

Thank you David, huge help! I appreciate you tracking down the source of the code.

[David]

You’re welcome

[Author]

Posts