CSS - porqué cuando hago mi menú responsivo, no me salen mis opciones?

Val: 1

porqué cuando hago mi menú responsivo, no me salen mis opciones?

Publicado por fanny (1 intervención) el 23/09/2016 02:05:51

Que tal, estoy trabajando con bootstrap mi diseño web, y tengo una duda,
Tengo un menú con dos opciones, y quiero que sea responsive

cap2

ya tengo mi código, pero a la hora de reducir la pagina, me aparece el botón pero al presionarlo no sale mi menu, no sale nada,
como le hago? o cual es mi error?
Les dejo mi codigo:

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">

  <div class="container-fluid">

    <div class="navbar-header">

     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">

      <span class="sr-only">Desplegar navegación</span>

      <span class="icon-bar"></span>

      <span class="icon-bar"></span>

      <span class="icon-bar"></span>

    </button>

      <a class="navbar-brand" href="#">Sistema de Registro</a>

    </div>

  <div class="collapse navbar-collapse navbar-ex1-collapse">

    <ul class="nav navbar-nav navbar-right">

        <li class="active"><a href="#"><span class="glyphicon glyphicon-home"></span> Inicio</a></li>

        <li><a href="login.html"><span class="glyphicon glyphicon-log-in"></span> Salir</a></li>

    </ul>

  </div>

  </div>

</nav>

Me aparece asi

Captura

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

Responder

porqué cuando hago mi menú responsivo, no me salen mis opciones?

Publicado por DAVID (29 intervenciones) el 26/09/2016 13:05:44

Aqui tienes un ejemplo cogido de una pagina que funciona:

<nav class="navbar navbar-default">

    <div class="container-fluid">

      <div class="navbar-header">

        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">

          <span class="sr-only">Toggle navigation</span>

          <span class="icon-bar"></span>

          <span class="icon-bar"></span>

          <span class="icon-bar"></span>

        </button>

        <a class="navbar-brand" href="#">Project name</a>

      </div>

      <div id="navbar" class="navbar-collapse collapse">

        <ul class="nav navbar-nav">

          <li class="active"><a href="#">Home</a></li>

          <li><a href="#">About</a></li>

          <li><a href="#">Contact</a></li>

          <li class="dropdown">

            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>

            <ul class="dropdown-menu">

              <li><a href="#">Action</a></li>

              <li><a href="#">Another action</a></li>

              <li><a href="#">Something else here</a></li>

              <li role="separator" class="divider"></li>

              <li class="dropdown-header">Nav header</li>

              <li><a href="#">Separated link</a></li>

              <li><a href="#">One more separated link</a></li>

            </ul>

          </li>

        </ul>

        <ul class="nav navbar-nav navbar-right">

          <li class="active"><a href="./">Default <span class="sr-only">(current)</span></a></li>

          <li><a href="../navbar-static-top/">Static top</a></li>

          <li><a href="../navbar-fixed-top/">Fixed top</a></li>

        </ul>

      </div><!--/.nav-collapse -->

    </div><!--/.container-fluid -->

</nav>

Un saludo,
David
Madrid, diseño gráfico

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

Comentar