Bootstrap horizontal navbar not working. Appearing as verticle : Here is my html using bootstrap 

    <div class="col-lg-8 pull-right col-md-9 col-sm-9">
     <div class="col-lg-11 col-md-7 col-sm-5 ">
        <div id="navbar" class="navbar-collapse navbar-right collapse hover-effect">
           <ul class="nav navbar-nav">
           <li><a href="#about">ABOUT</a></li>
           <li><a href="#services">SERVICES</a></li>
           <li><a href="#gallery">GALLERY</a></li>
           <li><a href="#plans">PLANS</a></li>
           <li><a href="#faq">FAQs</a></li>
           <li><a href="#team">TEAM</a></li>
           <li><a href="#contact">CONTACT</a></li>
           </ul>
        </div> 
     </div>
    </div>   

I removed the CSS file also. but still the problem is same.

  