Hello,
I am having troubles to make the menu of my website works on Iphones (works on other phones and also works fine on webflow).
Only the logo is displayed and I can’t find any solution.
Here is the live version for you to try : arbustan.it
And here the webflow preview link : Webflow - Arbustan
Thank you very much for your time.
I’ve seen this happen when the menu wrapper has overflow:hidden or fixed positioning that iOS Safari doesn’t like. Try setting the nav container to position: relative with a higher z-index and double-check that the menu toggle isn’t hidden behind the logo on smaller breakpoints.
Hey @Arbustan ,
I was testing your site on other mobile device and the hamburger menu does not work on them either, including the preview mode in Webflow.
Can you set the Home Hero V2 Content Block element’s z-index value to be 1, as highlighted in the screenshot below? This seems to make the menu open up in preview and on the live site in smaller devices.
Hope this helps.
On iOS Safari I’ve had this exact issue , the hero section or first content block usually sits above the menu. Lower its z-index (or raise the nav’s) and make sure the menu wrapper isn’t clipped by overflow:hidden on a parent div. That usually clears it.
Hi, Thank you for your advice. I tried your solution but doesn’t work.
I did a backup though to make it work again on webflow and other mobiles (can you try to check again please) but iphone is still an issue.
I have tried to put the position te relative as adviced but still doesn’t work.
I don’t know what else to do as it works fine en webflow preview and on other mobiles
@Arbustan , yes now I can see the menu overlay in preview mode and other mobile devices.
I was trying to view the site in a phone simulator to check how it appears on iPhone devices and yes, the screenshot you shared is how I am able to see it as well. Since I don’t have the relevant device, I am not able to inspect the issue for you.
To troubleshoot this, can you create a new blank page and have your Header element placed there and test if the menu works on iPhone in that page?
If it does, you can try inspecting what elements on the other pages is conflicting with the menu overlay (based on z-index or positioning). Like you can set a higher z-index for Nav Menu Wrapper element and test it out.
If it does not work on the blank page, then the issue lies in the header element itself, so you can check the nav elements individually.
Hope this gives you some idea.
