центрирующий текст в навигационной панели CSS

Question

Я пытаюсь центрировать навигационную панель новой версией веб-сайта моего запуска. Новая версия скрыта в http://www.pintsteinpro.com/alternateMain.html. Если вы нажмете на какие-либо ссылки, вы попадете на мой основной сайт и нет ссылок, перенаправляющих вас на скрытый веб-сайт.

Я работаю с веб-дизайном от binarytheme.com, которые можно найти здесь: http://binarytheme.com/bootstrap-background-slideshow-template-vega/

Я нашел часть в коде, который управляет текст:

.nav a { 
    color:#ffffff !important; 

, но не количество добавление CSS в центр текста кажется сработавшим. Я пробовал:

text-align:center; 
margin: 0 auto; 
position:absolute; 
left:50%;top:0; 

Я также попытался изменить .navbar-header a центрировать текст без везения.

Этот раздел управляет цветом фона и вставляет различный центрирующий код внутри nav также не работал.

nav { 
    background: #fff; 
    z-index:99; 
} 
.fixed { 
    position: fixed; 
    top: 0; 
    min-height: 50px; 
    z-index: 99; 
} 

Любые идеи о том, что я должен попробовать дальше?

Answer 1

Вы можете использовать margin: 0 auto наряду с указанным width, чтобы центрировать ваш div, например.

.navbar-nav { 
    margin: 0 auto; 
    width: 700px; 
} 

Обратите внимание, что я удалил float: left

Answer 2

Набор text-align: center для:

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{ 
    border-color: #101010; 
    text-align: center; 
} 

И display: inline-block к:

.navbar-nav{ 
    margin: 0; 
    display: inline-block; 
} 

Я удалили float: left

Answer 3

Сделайте легкие шаги.

1. Добавить .navbar-nav{width: 100%; text-align: center;}
2. Удалить .navbar-nav > li {float: left;}
3. Добавить .navbar-nav > li {display: inline-block;}