Tengo una sección llamada Línea de tiempo que se desborda en otra sección llamada Contacto en mi sitio web de React.

¿Qué puedo hacer para que todo el contenido de Timeline se muestre pero no se desborde en otra sección?

Editar: la parte azul claro es donde comienza la sección Contacto

Editar:

 import React from 'react' import './app.scss'; import Navbar from "./components/navbar/Navbar" import Intro from "./components/intro/Intro" import Menu from "./components/menu/Menu" import Timeline from './components/timeline/Timeline'; import Contact from "./components/contact/Contact" import { useState } from "react" App.jsx function App() { const [menuOpen, setMenuOpen] = useState(false) return ( <div className="app"> <Navbar menuOpen={menuOpen} setMenuOpen={setMenuOpen}/> <Menu menuOpen={menuOpen} setMenuOpen={setMenuOpen}/> <div className="sections"> <Intro/> <Timeline/> <Contact/> </div> </div> ); }

app.scss

 .app { height: 100vh; .sections { width: 100%; height: calc(100vh - 70px); // background-color: #1F1D36; position: relative; top: 70px; scroll-behavior: smooth; display: flex; scroll-snap-type: y mandatory; scrollbar-width: none; // for firefox &::-webkit-scrollbar{ display: none; } > * { width: 100vw; height: calc(100vh - 70px); scroll-snap-align: start; } } }