Site logo

Archived topic

Help! My Mobile burger menu covers the content

8 replies · Started by Rene on June 28, 2020

Viewing posts 1–9 of 9

Here's the problem. You can see the menu covering the hero text

Here's the problem. You can see the menu covering the hero text.

I've tried changing the CSS values, but it only moves it along the line it's already on. The logo was originally covering the text as well, but I moved it to the top right corner manually.

Hi Leo,

No solution yet. You can see the menu hovering on the content rather than on the navbar itself. I would like it to align like this: https://imgur.com/a/qXNMm2l

Can you disable the merge option on the header element?

Don't think you need it.

Please also remove your custom CSS temporarily so I can see the issue better.

The screenshot you've linked should be the default mobile header layout without any custom CSS.

Sure. I'll remove the CSS. Where's the merge option? I can't find it in the customize -> menu or navigation

CSS Removed. This is what it looked like originally. original layout

In Appearance > Elements - edit your Header Element, go to the Site Header tab - there you can disable the Merge with Content.

You still have this CSS in your site Customizer > Additiona CSS:

/* Mobile Navigation Breakpoint */
@media (max-width: 922px) {
    .site-logo {
        width: 140px;
        margin: 0 auto 32px auto !important;
        /* 		 margin: 0 12px 32px!important; */
        display: block;
    }
}

Remove this as its interfering with the logos position.

Perfect! I've been struggling with this for weeks. Thanks for the help David & Leo. Much appreciated.

You're welcome - glad we could be of help

This archived topic is closed to new replies.