Streaming live at 10am (PST)

Transform Z bug in mobile/tablet view (issue only in Safari)

Hi Webflow Team,
I am noticing a bug in Safari using the drop down nav on tablet /mobile.

Shareable Link: https://preview.webflow.com/preview/lunavi?utm_medium=preview_link&utm_source=designer&utm_content=lunavi&preview=8388ca069399ccfeebb84275a77e7f58&mode=preview

Right now there seems to be an issue where the built in JS is not setting the z position for the nav-menu overlay. The result is that the content of the dropdown menu is blending with the content below. I initially thought this was a z-index problem as I had been messing with Z-index for the position of other content. After ruling that out, I used the inspector in Safari and found that if you add “…translateZ(any pixel value)” in the style imbed for that nav element, the content displays as expected. Since I have no ability to change this value in my code, I need Webflow to take care of this, or provide a temporary fix.

Before

After

I tried adding a ‘transformZ’ css tweak on the nav-menu element, but it does not seem to have fixed the issue.

Please help.

-Joshua W. Smith

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.