0

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.

introducir la descripción de la imagen aquí

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.