Closed AndrewAlva closed 6 years ago
Dani! Ya encontré qué es, tienes 2 elementos que causan el scroll horizontal, el slider-page y la metabola morada de la derecha, lo que sucede es que falta el overflow:hidden en toda la sección.
Recuerdas que íbamos a estar desplazando 'slider-page' para simular el movimiento de los elementos? Necesitamos que alguien le aplique una máscara a ese elemento, en este caso sería 'section-slider'; section-slider es quien debe llevar el overflow: hidden. Igual cuando le caigas platicamos más sobre eso para que te quede súper claro.
Eso mismo está pasando en 'icons-section' y en 'cards-container'.
El elemento de adorno en la segunda sección te está causando un scroll no deseado horizontalmente porque cuando lo giras se vuelve más ancho que la página, me refiero a este elemento:
Ten cuidado y mantén los ojos abiertos para descubrir cuando esto te suceda; hay algunos navegadores que tienen el scroll siempre presente cuando los elementos sobrepasan la pantalla y eso te crea una sensación de estorbo.
Para solucionar esto, debes "recortar" el sobrante, esto lo logras creando una máscara de recorte con el elemento padre, esto hace que los hijos de ese padre que lo sobrepasen, aunque sea solo un pixel o 1000px no se vean; la propiedad que te hace eso es "overflow: hidden". Por ejemplo, si le pongo overflow hidden al hero section donde hay elementos que se están saliendo quedaría así: