Menu for mobile pushing page down

Hi there,

try adding this CSS:

#mobile-header.toggled .main-nav > ul {
    position: fixed;
    width: 100%;
    background-color: #fff;
}

Hi David,
That works, indeed. Thank you very much.
Best Regards,
Raul

You're welcome

Sorry to necro an old thread, but this doesn't seem to work anymore.

Any chance you could add updated code to work with the latest version?

Hi Joel,

Can you open a new topic and link us to your site?

Hi Ying, the site I'm working on is https://dev.lcsnetworks.com/

Thanks,

Try this CSS:

.main-navigation.toggled .main-nav>ul {
    position: absolute;
    width: 100%;
    top: 1.5em;
}

.has-inline-mobile-toggle #site-navigation.toggled {
    margin-top: 0;
}

Hooray, it works! 🎉🎉🎉

Thank you for the quick response Ying.

Also, what an awesome and light weight theme! :-)

EDIT: Whoops! I spoke to soon.

It works in the mobile version of Firefox, but not in Safari on IOS.

Is there some different CSS being applied on Apple?

It was a PEBKAC error. Forgot to save! Whoops. Everything works great, this is a perfect solution thanks!

You are welcome :)

Glad you are happy with our theme!

Spoke to soon! It works in the mobile version of the desktop browser, but not in any browser on my iPhone.

I'm using a private browsing window.

Tested in Firefox Focus on IOS as well.

Did you clear cache after the CSS has been added?

Oh my mistake. It wasn't the cache - rather, my changes didn't save for some reason🤦

It works! My PEBKAC error of the day 😂

Thank you again!

Lol you are welcome :)