Nav menu on tablet and phones not showing correctly

Here is my site Read-Only:

I have created a simple nav menu, it enters from the right side of the page and should cover all content except the logo and menu icon.

When I test the menu on desktop in preview mode it works fine. When it’s published and tested on a browser on a desktop it works fine. But when I test it on tablet and mobile the menu is underneath the heading text. I have set the z-index of the menu to 100, the logo and menu icon to 101, and the heading text to 1.

Any ideas why this might be happening? I have cleared all cookies etc and also tested it on various phones.



Did you solve this issue - I wonder how/ share :slight_smile:

Hi @shokoaviv ,

Sorry I should have sent an update.

I’m not sure what the issue was, it must have been a bug with Webflow but I’m not sure what caused it. I deleted the hero section and rebuilt it with all the same classes and for some reason it works now.

1 Like

Hi @shokoaviv

I just realised the problem. The hero text had a ‘move’ animation that went from (initial position) ‘z: 1’ to (end position) ‘z: 1’ and this is what caused the text to be above the menu, even though the menu’s z-index is 100. Does that make sense?