Разместить ссылки в середине панели div

Мне нравится делать следующее с помощью CSS:

Иметь панель Div 100pt от верхней части страницы. Панель div будет иметь толщину около 100 пт. Затем в "середине" панели div мне нравятся пункты меню. До сих пор я получил следующее, однако пункты меню (ссылки) не центрированы:

.top_header {
    background-color:#3B5998; 
    height:70px; 
    margin-left:0px; 
    margin-right:0px; 
    top:60px; 
    position:relative 
}

.top_header a, .top_header a:visited, .top_header a:hover, .top_header a:active, .top_header a:focus {
    color:white; 
    font-size:x-large; 
    font-family:Arial
}

4 ответа

Решение

Один из способов сделать это - добавить line-height, установив его так же height как div,

line-height:70px; 

http://jsfiddle.net/jasongennaro/EXqkT/

Это выравнивает его по вертикали.

Затем, если вы хотите центрировать его по горизонтали, вы можете добавить

text-align:center;

http://jsfiddle.net/jasongennaro/EXqkT/1/

Добавлять

`text-align:center;'

в.top_header.

Добавлять margin:auto в .top_header a

Добавить стиль text-align:center; в top_header div http://jsfiddle.net/rajani5022/CpsX2/4/

Другие вопросы по тегам