My navbar is not expanding after collapse

123 views Asked by At

My navbar is not working as intended, it collapses but when I click I can't expand it:

  <!-- Navbar -->
 <nav class="navbar navbar-fixed-top res" role="navigation" id="my-navbar">
   <div class="container-fluid">
       <div class="navbar-header">
           <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
           </button>
           <a href="" class="navbar-brand"></a>
       </div><!--End navbar-header -->
       <div class="collapse navbar-collapse navbar-right" id="navbar-collapse">
           <ul class="nav navbar-nav"data-spy="affix" data-offset-top="10">
               <li><a href="#">Feedback</a>
               <li><a href="#">Gallery</a>
               <li><a href="#">Features</a>
               <li><a href="#">Faq</a>
               <li><a href="#">ContactUs</a>
           </ul>
       </div>
       <div class ="container-fluid" id="skullcenter">
                <img style= "max-width:400px" src="http://i264.photobucket.com/albums/ii199/mariniyakaos/Untitled-4_zpsjwcyu3cy.png" alt="">
                 </div>
       <!--<h1>CONVERTIMOS TUS IDEAS EN ATRACTIVOS DISEÑOS.</h1>-->
       <div class="container" id="socialmedia">
       <i class="fa fa-facebook-square fa-4x"></i>
       <i class="fa fa-twitter-square fa-4x"></i>
       <i class="fa fa-linkedin-square fa-4x"></i>
       </div><!--Social DIV CONTAINER-->
   </div><!-- End container -->

Edited to fix my code, I forgot to copy the closing div and nav.

1

There are 1 answers

0
Dmitriy On

add class navbar-default for nav

close tag nav and div

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/>
<nav class="navbar  navbar-default navbar-fixed-top res" role="navigation" id="my-navbar">
    <div
    class="container-fluid">
        
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
            </button> 
            <a href="#" class="navbar-brand"></a>
        </div>
        
        <div class="collapse navbar-collapse navbar-right" id="navbar-collapse">
            <ul class="nav navbar-nav" data-spy="affix" data-offset-top="10">
                <li><a href="#">Feedback</a></li>
                <li><a href="#">Gallery</a></li>
                <li><a href="#">Features</a></li>
                <li><a href="#">Faq</a></li>
                <li><a href="#">ContactUs</a></li>
                    
            </ul>
        </div>
    </div>
</nav>