Bootstrap 3 - Always Open Navbar

by Kyle Mitofsky

HTML

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<nav class="navbar navbar-inverse always-open">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">Brand</a>
        <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>
        </button>
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
        </ul>
    </div>
</nav>







<!-- Post Info -->
<div style='position:fixed;bottom:0;left:0;    
            background:lightgray;width:100%;'>
    Find documentation: <a href='http://getbootstrap.com/css/'>Get Bootstrap 3</a><br/>
    Fork This Skeleton Here: <a href='http://jsfiddle.net/KyleMit/kcpma/'>Bootstrap 3 Skeleton</a><br/>
<div>

CSS

.navbar.always-open {
    border-radius: 0;
}
.navbar.always-open .navbar-header {
  float: none;
}
.navbar.always-open .navbar-toggle {
  display: block;
}
.navbar.always-open .navbar-collapse {
  border-top: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
}
.navbar.always-open .navbar-collapse.collapse {
  display: none!important;
}
.navbar.always-open .navbar-nav {
  float: none!important;
  margin: 7.5px -15px;
}
.navbar.always-open .navbar-nav>li {
  float: none;
}
.navbar.always-open .navbar-nav>li>a {
  padding-top: 10px;
  padding-bottom: 10px;
}