Certamente, você não está sozinho se já encontrou problemas com o position: fixed em dispositivos móveis. Em muitos casos, parece que ele é tratado como um position: absolute em dispositivos touch, o que pode ser bastante frustrante.
Ao rolar a tela para baixo, parte do elemento sobe junto, muitas vezes, cortando metade do menu ou outro elemento.
No entanto, há uma solução simples. Primeiro, certifique-se de incluir a seguinte meta tag em seu HTML para configurar corretamente a visualização em dispositivos móveis:
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, user-scalable=no”>
Em seguida, ajuste o CSS do elemento que está dando problema. Lembre-se de adicionar o prefixo automático adequado ao seu código, se necessário:
backface-visibility: hidden;
Problema resolvido!