i cant seem to center them within the container, i tried using text align but wouldnt work. I am using twitter bootstrap so maybe something is taking priority?
<div class="container">
<ul class="nav nav-pills" role="tablist">
<li role="presentation" class="active"><a href="#">Home</a></li>
<li role="presentation"><a href="#">TierList</a></li>
<li role="presentation"><a href="#">Tournaments</a></li>
<li role="presentation"><a href="#">Team Maker</a></li>
<li role="presentation"><a href="#">Counters</a></li>
<li role="presentation"><a href="#">Forum</a></li>
<li role="presentation"><a href="#">Contact Us</a></li>
</ul>
css
.nav-pills > li > a {
margin-right:10px; /* pill spread */
font-family: "kodakku"; /* font */
font-size: 20px;
}
Wrap up your nav with another div and use text-center, and use display:inline-block.
HTML
<div class="container">
<div class="text-center">
<ul class="nav nav-pills" role="tablist">
<li role="presentation" class="active"><a href="#">Home</a></li>
<li role="presentation"><a href="#">TierList</a></li>
<li role="presentation"><a href="#">Tournaments</a></li>
<li role="presentation"><a href="#">Team Maker</a></li>
<li role="presentation"><a href="#">Counters</a></li>
<li role="presentation"><a href="#">Forum</a></li>
<li role="presentation"><a href="#">Contact Us</a></li>
</ul>
</div>
</div>
CSS
.nav-pills{
display: inline-block;
}
.nav-pills > li > a {
margin-right:10px; /* pill spread */
font-family: "kodakku"; /* font */
font-size: 20px;
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments