Die Transformationsanimation eines Elements führt nur in iOS dazu, dass es den Header mit fester Position überlappt ⇐ CSS

[Guest]

Ich erstelle eine Website, die eine hier gefundene Kartenumdrehungsanimation nutzt und über ein Navigationsmenü mit fester Position verfügt. Wenn die Karte in einem beliebigen Browser unter iOS umgedreht wird, wird sie vor das feste Navigationsmenü verschoben. Es funktioniert einwandfrei in jedem anderen Browser, den ich bisher getestet habe, einschließlich Chrome auf einem Android-Telefon.

Ich habe eine Reihe von Gründen dafür gefunden, die von der Hardware reichen können Beschleunigungsprobleme bei Transformationen, die auf einer anderen „Ebene“ als flachen Elementen stattfinden (ohne Berücksichtigung des Z-Index). Ich habe versucht, transform: translator3d(0px, 0px, 0px); auf das Navigationsmenü anzuwenden und TranslateZ zu verwenden, um die Position zu ändern, zusammen mit einigen anderen Hacks, die noch nicht funktioniert haben.