I am constructing this web site: https://bewerty.de/KUNDEN_PROJEKTE/Itau/manufacturing/#residence
One of many nicer components is a menu that’s considerably animated.
Nevertheless, if I open the web page on iOS Safari & Chrome, the stacking order (z-index) is reversed. We’re speaking in regards to the components and their ::earlier than pseudoes.
I learn someplace that z-index and remodel: translate3d does not play good togehter. Regardless of this not being a problem on my desktop browsers, I eliminated z-index and made certain to set translate3d(0, 0, 1px); on the button component, and remodel: translate3d(0, 15px, -100px) on the pseudo.
This doesn’t resolve the difficulty. Including a -webkit- prefix additionally wasn’t any assist…
What am I lacking right here?