2017-08-11 2 views
0

Mon code fonctionnait bien, mais j'ai décidé d'ajouter un bouton hamburger, et maintenant j'ai un problème.Bootstrap navbar s'effondre bien, mais ne s'affiche pas sur grand écran

Le bouton fonctionne correctement, mais lorsque mon écran est plus grand que le point d'arrêt, aucune navigation n'apparaît sur mon écran. Je suis sûr que c'est une question de manquer une étiquette ou quelque chose, mais je ne peux pas le voir et pourrait utiliser de l'aide. J'ai jQuery et Bootstrap 3 et CSS chargé.

<nav class="navbar navbar-default navbar-fixed-top"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data- 
toggle="collapse" data-target="#collapsemenu" aria-expanded="false"> 
     <span class="src-only">Menu</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
      </button> 
     <a class="navbar-brand" href="#">LORI</a> 
    </div> 
<div class="collapse navbar collapse" id="collapsemenu"> 
    <ul class="nav navbar-nav"> 
     <li><a href="#about">ABOUT</a></li> 
     <li><a href="#portfolio">PORTFOLIO</a></li> 
     <li><a href="#contact">CONTACT</a></li> 
    </ul> 
    </div> 
    </div>  

</nav> 

Répondre

0

Essayez ceci. ce code fonctionne

<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span>       
     </button> 
     <a class="navbar-brand" href="#">Lori</a> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 
     <ul class="nav navbar-nav"> 

     <li><a href="#">Page 2</a></li> 
     <li><a href="#">Page 3</a></li> 
     </ul> 

    </div> 
    </div> 
</nav>