Изменить навигационную панель twitter bootstrap

Я пытался модифицировать панель навигации начальной загрузки Twitter, на данный момент все ссылки выровнены по левому краю, тогда как мне бы хотелось, чтобы они были центральными.

В другом посте я прочитал, что вы используете это

.tabs, .pills {
  margin: 0 auto;
  padding: 0;
  width: 100px;
}

Но это не сработало для меня

Что мне нужно изменить в css, чтобы это произошло, я понимаю, что поместил модифицированный css в бутстрап и переопределяет.

Любая помощь приветствуется

это моя разметка

макеты/приложение

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container-fluid">
      <a 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>
      </a>

    <a class="brand">Newbridges</a>  

  <% if user_signed_in? %>
    <div class="nav-collapse">
      <ul class="nav ">
      <%= render "shared/navbarlogin" %>
    </div>

    <% else%>
    <div class="nav-collapse">
      <ul class="nav">

      <%= render "shared/navbar" %>
    </div>
    <% end %>

Я также пробовал это

.nav > li {
  float: none;
  display: inline-block;
  *display: inline;
  /* ie7 fix */
  zoom: 1;
  /* hasLayout ie7 trigger */
}
.nav {
  text-align: center;
}