Mobile menu doesnt take up full screen/appear correctly in safari

[Willem_Reyners_Tay]

Hiya,

Ive been struggling for this for a while and I dont really undertand.

The menu works correctly in chrome, firefox and android.

However in safari (ios) and in an inspector inside safari (osx) the menu is often cut off not taking the full width of the screen, and occasionally other elements will appear above it, even though the menu should be the very top.

I have tried removing all the custom code I had in there. Doesn’t fix it.

I also noticed that the javascript that controls the menu if giving a specific width, which happens to be where its cut off.

It looks like on safari, it’s just not rendering the w-nav-overlay section at all.

Webflow Mobile Menu Error Safari

I have managed to “Fix” it by entering the following into custom code.

.w-nav-overlay {

overflow:visible!important;

}

But this seems like a super dodgy way of going about it.

---

Here is my site Read-Only: *https://preview.webflow.com/preview/heard-website?utm_source=heard-website&preview=e28130da193b55bc7c77ed727743c59f

[Brando (Brandon Roche)]

Hi @Willem_Reyners_Tay

Thanks for posting about this. I’ve reached out to one of our Frontend engineers to see if they can take a look at your design and hopefully find a solution for you.

We’ll post back as soon as we have more info — thanks for your patience!