-1

Buenas estoy montando una pagina web con Bootstrap me gustaría saber si hay alguna clase especifica o como podría hacer para dejar mi menu estatico al hacer scroll hacia abajo. He estado mirando guias y no me ha dejado ponerlo a puro html, me pregunto si hay algun tipo de problema de querer modificar clases de bootstrap a puro codigo html.

        <div class="container-fluid">
          <a class="navbar-brand" href="#">
              <span class="text-primary fs-22 fw-bold">Menu</span>
            </a>
          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">

              <li class="nav-item">
                <a class="nav-link active" aria-current="page" href="index.html">Inicio
                </a>
              </li>

              <li class="nav-item">
                <a class="nav-link" href="#">Equipo</a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Contacto</a>
              </li>
              </ul>

            <form class="d-flex">
              <input class="form-control me-2" type="email" placeholder="Correo Electronico" aria-label="email">
              <button class="btn btn-primary btn-primary-outline-success" type="button">Suscribete</button>
            </form>
          </div>
        </div>
      </nav>```

3
  • Hola, bootstrap tiene una clase fixed-top puedes checar un ejemplo aca getbootstrap.com/docs/5.0/examples/navbar-fixed el 4 feb. 2022 a las 2:50
  • Pon el inicio de tu <nav> en el ejemplo que has puesto, te lo has dejado y no se ve tu menu. Y normalmente las clases container y container-fluid envuelven todo lo que va dentro del body, nav incluido. Puedes editar tu pregunta
    – masterguru
    el 4 feb. 2022 a las 4:22
  • Dejo por aquí un enlace a otra pregunta por si esa solución esta solución te puede ayudar.
    – AlemolAMG
    el 21 mar. 2023 a las 11:38

1 respuesta 1

0

A la etiqueta que contenga todos los componentes de tu menú agrégale en su estilo posición fija y acomódalo en la pantalla con top/bottom y left/right; e.g. :

<div style="position: fixed; right: 10vw; bottom: 10vw;">
<h3>Ejemplo de menú flotante</h3>
<a>cta</a>
</div>

Tu Respuesta

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

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.