Sé que los iPhones solíanno posición de soporte: fija, pero ahora lo hace y veo un error extraño cuando desplazo un elemento de posición fija detrás de otros elementos con un índice z más alto. El elemento de posiciones fijas con el índice z inferior aparece en la parte delantera momentáneamente, lo que se ve muy mal. ¿Hay alguna manera de prevenir esto?

Intenté agregar-webkit-transform: translate3d(0, 0, 0); Para el elemento fijo y no parece ayudar a este problema.

Aquí hay un jsfiddle también.

Actualizar yo añadítransform:translateZ(x) además del índice z y no solucionó el problema.

Actualización2 yo añadí-webkit prefijo y esto SÍ soluciona el problema del índice z en un Safari móvil, pero también causa que la posición: solucionada funcione incorrectamente en el escritorio de Chrome.