Tengo un encabezado con menú, que se cambia a menú de hamburguesas cuando el ancho de la pantalla es inferior a 650 px. Después de eso, el menú se posiciona como absoluto y se traduce a la derecha. Cuando hago clic en el menú de hamburguesas, se desliza a la vista. Después todo funciona, pero no puedo hacer que desaparezca el desbordamiento. Traté de experimentar agregando desbordamiento a diferentes elementos principales, pero fue en vano.
Aquí está la página: https://badgerwannabe.github.io/rocket-sockets/index.html Aquí hay un representante de Github con archivos, ingrese la descripción del enlace aquí
Estaría agradecido por cualquier ayuda.
UPD1: Pasos para reproducir Vaya al sitio web, abra Dev Tools y cambie el tamaño de la ventana gráfica a menos de 650 px de ancho, intente desplazarse hacia la derecha y verá el problema. Agregar desbordamiento al cuerpo en esta consulta de medios no ayuda
Si agrega overflow: hidden al elemento del cuerpo cuando abre el menú, creo que eso es lo que está buscando. Si no, ¿puede especificar más de qué desbordamiento está tratando de deshacerse?
Editar: según el comentario, si agrega overflow-x: hidden a la etiqueta del body , eso debería hacerlo por usted.
El problema está ocurriendo debido a los siguientes elementos.
... <img class="background-line" alt="background-line" src="assets/images/Path 18.png"> ... <img id="mailbox-sm" src="assets/images/Mask Group 4.png" alt="small mailbox"> ...Hay dos opciones.
overflow-x: hidden al elemento del body .Cuando traduce el menú a la derecha (es decir, fuera de la vista), también puede configurarlo
display: none;
volviendo a ponerlo en
display: flex
cuando quieras que se deslice a la vista.