Categorias
como exibir conteudo diferente para cada navegador com php

Menu no mobile com position:fixed cortando ao rolar para baixo

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!