Twitter Bootstrap Navbar not displaying as expected

Andre Lombaard

I'm using twitter bootstrap and defined a navbar

<div class="navbar navbar-fixed-top">  
    <div class="navbar-inner">  
        <div class="container">  
            <ul class="nav">  
                <li class="active">  
                     <a class="brand" href="#">w3resource</a>  
                </li>  
               <li>
                   <a href="#">About</a>
               </li>  
              <li>
                 <a href="#">Portfolio</a>
              </li>  
              <li>
                  <a href="#">Contact</a>
              </li>  
          </ul> 
       </div>  
   </div>  
</div>

I included the bootstrap css files, jquery and the bootstrap js files. The navbar is displayed as indicated by the image below.

enter image description here

This is strange because the other elements on the page seems to style just fine using bootstrap, have a look at the image below

enter image description here

Any ideas why this happens?

Andre Lombaard

Ok so I finally got the navbar to display as expected, this is what I did.

I uninstalled twitter bootstrap and re-installed using NuGet to make sure I have the latest version (Version 3.0.0).
The syntax to create a navbar for bootstrap version 2.0.0 and 3.0.0 is different. Have a look at this post that explains the difference.

After installing the newest version and updating the syntax, everything worked as expected.

Collected from the Internet

Please contact [email protected] to delete if infringement.