Reputation: 545
I am hoping someone can help me figure out why the collapse in my Bootstrap navbar isn't working. From what I have seen from the Bootstrap examples, it should work. When I view the page on a mobile device or just shrink the window, the nav links collapse as they should, but the button to expand it does not show up.
<nav class="navbar">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
<a href="#" class="pull-left"><img src="/images/logo.png"></a> </div>
<div class="navbar-collapse collapse">
<div class="navbar-right"><a href="/contact">CONTACT</a></div>
<div class="navbar-right"><a href="/about">ABOUT</a></div>
<div class="navbar-right"><a href="/ourteam">OUR TEAM</a></div>
<div class="navbar-right"><a href="/work">WORK</a></div>
<div class="navbar-right"><a href="/services">SERVICES</a></div>
</div>
</div>
</nav>
EDIT
I went through the comments and checked everything. There was an issue with jquery not loading, but I resolved that. Still happening though.
Upvotes: 0
Views: 51
Reputation: 128
Your data target in the button is .navbar-ex1-collapse
but you have not included that in <div class="navbar-collapse collapse">
Include that and try out.
Upvotes: 1