Ayuda por favor, quisiera dejar por fuera el efecto scrolling del contenido. Cuando el contenido habilita el scroll, este se ve reflejado en toda la página afectando el topbar.
Componente App.js:
function App() {
return (
<div className="App">
<BrowserRouter>
<Navbar />
<div className='container'>
<Routes>
<Route path='/' element={<Simulador />} />
</Routes>
</div>
</BrowserRouter>
</div >
);
}
Componente Navbar(topbar):
const Navbar = () => {
return (
<>
<nav className="navbar navbar-expand-lg bg-body-tertiary">
<div className="container">
<Link to="/">
<div className="logo-holder logo-3">
<h3>Simulador</h3>
<p>Calendario de Pagos</p>
</div>
</Link>
<button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarScroll" aria-controls="navbarScroll" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
</button>
</div>
</nav>
</>
)
}
Probé agregando a la clase .navbar position:fixed, z-index:1, también agregué en el body overflow:hidden, entre otras pero ningúna me ha funcionado. No logro exluir el segmento de navegación del scrolling del contenido. Agradezco algo de apoyo.