Personal - centre nav bar
by panchroma
HTML
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css">
<head>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet">
</head>
<div class="navbar center">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand hidden-desktop" href="./index.html">Title</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="">
<a href="./getting-started.html"><strong>Home</strong></a>
</li>
<li class="">
<a href="./getting-started.html"><strong>Online Rug Store</strong></a>
</li>
<li class="">
<a href="./scaffolding.html">Wall-to-Wall Carpeting</a>
</li>
<li class="">
<a href="./base-css.html">Rug & Carpet Cleaning</a>
</li>
<li class="">
<a href="./components.html">Repair</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<p>
To have left align on tablets and mobiles <br>
...
CSS
.center.navbar .nav,
.center.navbar .nav > li {
float:none;
display:inline-block;
*display:inline; /* ie7 fix */
*zoom:1; /* hasLayout ie7 trigger */
vertical-align: top;
}
.center .navbar-inner {
text-align:right;
border:none;
background-image:none;
background-color:transparent;
}
.navbar-inner {
background-color: #ffffff; /* fallback color, place your own */
background-image: none;
background-repeat: no-repeat;
filter: none;
border: none;
box-shadow: none !important;
}