I'm having a problem trying to centralize a nav on a grid.
The fiddle is here , and I wanted it, when the space was over and the "cells" stacked, the nav would be centered as neither the wordpress paragraph.
I did not find any reference other than navbar (I'm not going to use it for functional issues) and apparently focused on older versions.
Anyway, what solution could I take?
Doubt answered English post .
class .nav-pills has float:left by default. So just put it to none and then show them all on a line with display: inline-block .
#page_footer {
background-color: #f5f5f5;
width: 100%;
}
#page_footer .container {
padding: 20px;
}
#page_footer_links {
margin: 0 auto;
text-align: center;
}
#page_footer_wordpress {
margin: 0px;
height: 40px;
line-height: 40px;
}
.nav-pills > li {
float: none !important;
display: inline-block !important;
}
-
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<footer id="page_footer">
<div class="container">
<div class="row">
<div class="col-md-8">
<ul id="page_footer_links" class="nav nav-pills nav-center">
<li role="presentation"><a href="#">Home</a>
</li>
<li role="presentation"><a href="#">Profile</a>
</li>
<li role="presentation"><a href="#">Messages</a>
</li>
</ul>
</div>
<div class="col-md-4">
<p id="page_footer_wordpress" class="text-center">Orgulhosamente movido com <a href="http://wordpress.org/" title="A Semantic Personal Publishing Platform" rel="generator" target="_blank">WordPress</a>!!!</p>
</div>
</div>
</div>