Streaming live at 10am (PST)

Odd overlap behaviour with transformed objects over menu

Hi everyone,

I’m sure there’s a workaround to this, and a reason why it’s happening, but I just can’t find it and I’d really appreciate some thoughts here.

I am working on our new site and have a mock-mobile browser displaying a client site which is giving us grief. This has a rotate and perspective transformation which seems to directly affect some layering; when viewing the site on my physical iPhone X it has a portion which overlaps the navigation menu (open or closed nav).

We’ve tried various nesting setups, checked and adjusted z-index parameters, but as far as I can see everything is configured as it should be. To back this theory up, it works as expected on Webflow preview and on desktop browsers for this resolution.

I can always remove the transformation for mobiles but I’d rather fix with the current design if possible.

I appreciate this one may be awkward to try and test a fix but here’s my read-only link anyway and if somebody could offer some clues I’d really appreciate it.


Screenshot of the issue:


Affected page: v2 Home

Staging URL:

Read Only link:

1 Like

Bumping this up in the hope somebody would have some ideas…

Upon further checking, this appears to be only affecting all Safari browsers I have been able to check, not just iOS Safari. It’s actually a bigger issue on desktop too as more elements are sat above the menu.

Is this a bug in how Webflow presents this, or am I doing something that is known not to work properly in Safari?


In case anybody ever has this issue, it seems it has been resolved by setting a perspective value to the parent wrapper container.

Honestly, I don’t really know why - but it does work.

thanks, had the same problem.