Горизонтальный вопрос меню CSS - PullRequest
0 голосов
/ 16 марта 2011

У меня есть простое горизонтальное меню ul, которое существует в div, для которого установлено значение 10% высоты и 100% ширины. Как можно центрировать текст по горизонтали и вертикали внутри него?

#navlistcontainer {
    position:fixed;
    height:10%;
    bottom:0px;
    left:0px;
    right:0px;
}
#navlist li {
    display: inline;
    list-style-type: none;
}
#navlist li a {
    color:#FFF;
}

  <div id="navcontainer">
    <ul id="navlist">
        <li><a href="index.html">START</a></li>
    </ul>
  </div>

Ответы [ 2 ]

1 голос
/ 16 марта 2011

попробуйте это:

#navlist {
 text-align: center;
 display: block;
}

#navlist li {
 display: inline;
}

Для вертикального выравнивания вам необходимо установить высоту строки navlistcontainer равной ее высоте.Я не уверен, что это будет работать с высотой в процентах.Учтите это:

#navlistcontainer {
 height: 50px;
 line-height: 50px;
}

Вот jsFiddle: http://jsfiddle.net/FH9sZ/

0 голосов
/ 16 марта 2011

Вы не должны определять высоту как приоритет. http://jsfiddle.net/zzdGx/ вот вам и скрипка для этого.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...