CODEWITHSUNDEEP
twitter-bootstrap
Devin Goble
Devin Goble

Reputation: 2867

How to show multiple Twitter Bootstrap navbar's on the same page?

Is it possible to show more than one navbar on a given page? I'd like to have an inverted navbar fixed to the top, and then on certain pages have a second fixed navbar right under it as an additional information header.

Upvotes: 16

Views: 32391

Answers (1)

Carol Skelly
Carol Skelly

Reputation: 362700

Sure you can have 2 navbars. You may have to tweak the code to get it the way you want...

Working Example

<div class="navbar navbar-static-top navbar-inverse">
  <div class="navbar-inner">
    <a class="brand" href="#">Brand</a>
    <ul class="nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">More</a></li>
      <li><a href="#">Options</a></li>
    </ul>
  </div>
</div>
<div class="navbar">
  <div class="navbar-inner">
    <ul class="nav">
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
    </ul>
  </div>
</div>

Upvotes: 13

Related Questions