Hey there,

I'm having a lot of trouble centering the contents of the nav, and I'm not 
sure where I'm going wrong.  Any help would be greatly appreciated!

Since it's the .nav element that I want centered, I thought applying 
margin-left and -right would do the trick, but to no avail.  Is that 
because it's centering the contents inside .nav? Is there a clean and easy 
way to center the nav elements inside the navbar?

CSS:
 .navbar .nav {
   margin-left: auto;
   margin-right: auto;
 }

HTML: 
<div class="navbar">
  <div class="navbar-inner container">
        <ul class="nav">
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
              A
              <b class="caret"></b>
            </a>
            <ul class="dropdown-menu">
              <li><a href="#">A.1</a></li>
              <li><a href="#">A.2</a></li>
              <li><a href="#">A.3</a></li>
              <li class="divider"></li>
              <li><a href="#">A.4</a></li>
            </ul>
          </li>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
              B
              <b class="caret"></b>
            </a>
            <ul class="dropdown-menu">
              <li><a href="#">B.1</a></li>
              <li><a href="#">B.2</a></li>
              <li><a href="#">B.3</a></li>
            </ul>
          </li>
          <li><a href="#">C</a></li>
          <li><a href="#">D</a></li>
          <li><a href="#">E</a></li>
        </ul>
  </div>
</div>

Reply via email to