Не работает vertical-align

[Torawhite]

Здравствуйте! Столкнулся с такой проблемой: vertical-align отказывается работать - при установке значения "middle" выравнивает по верхнему краю, не могу понять почему... Возможно, сталкивался кто-то?

HTML:

<div id="menu">
        <a title="Главная страница" href="http://www.torawhite.ru/" target="_self" id="home"></a>
        <a href="#" target="_self" id="magazine">ЖУРНАЛ</a>
        <a href="#" target="_self" id="market">МАРКЕТ</a>
        <a href="#" target="_self" id="more">ЕЩЕ</a>
    </div>

 

CSS:

#menu {
    position: absolute;
    height: 30px;
    width: 268px;
    bottom: 5px;
    left: 0px;
    }

#menu a {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    background-size: contain;
    border-right: 1px solid #FFFFFF;
    cursor: pointer;
    font: 14px ProximaNova-Reg, Verdana;
    text-decoration: none;
    color: #FFFFFF;
    }

#menu a:hover, #menu .active_menu {
    background-color: #BF1238;
    background-size: contain;
    }


#home {
    position: absolute;
    background: url(http://www.torawhite.ru/images/main.svg) no-repeat;
    left: 0px;
    width: 30px;
    height: 30px;
    }

#magazine {
    position: absolute;
    left: 31px;
    width: 90px;
    height: 30px
    }

 #market {
    position: absolute;
    left: 122px;
    width: 84px;
    height: 30px;
    }

#more {
    position: absolute;
    left: 207px;
    width: 60px;
    height: 30px;
    }

Edited December 7, 2014 by Torawhite

[npofopr]

из-за position: absolute; для ссылок не работает.

Вообще не понятно зачем оно там.

Как вариант, пользуйтесь line-htight: высота ссылки;

[Torawhite]

  On 12/7/2014 at 3:39 PM, npofopr said:

из-за position: absolute; для ссылок не работает.

Вообще не понятно зачем оно там.

Как вариант, пользуйтесь line-htight: высота ссылки;

line-htight: поднимает только выше за границу ячейки

  On 12/7/2014 at 3:39 PM, npofopr said:

из-за position: absolute; для ссылок не работает.

Вообще не понятно зачем оно там.

Как вариант, пользуйтесь line-htight: высота ссылки;

Без position разве можно как-то позиционировать эти ссылки?

[npofopr]

  On 12/7/2014 at 4:19 PM, Torawhite said:

Без position разве можно как-то позиционировать эти ссылки?

Что? Вы вообще представляете, что такое таблица? Я вообще не понимаю, зачем вы абсолюты туда навтыкали. 

[Torawhite]

  On 12/7/2014 at 4:22 PM, npofopr said:

 

  On 12/7/2014 at 4:19 PM, Torawhite said:

Без position разве можно как-то позиционировать эти ссылки?

Что? Вы вообще представляете, что такое таблица? Я вообще не понимаю, зачем вы абсолюты туда навтыкали. 

 

Представляю, но если убрать position:absolute, то ячейки прилипают к левому краю блока. Это же ссылки, которые представлены в виде табличной ячейки, а не цельная таблица.

  On 12/7/2014 at 4:22 PM, npofopr said:

 

  On 12/7/2014 at 4:19 PM, Torawhite said:

Без position разве можно как-то позиционировать эти ссылки?

Что? Вы вообще представляете, что такое таблица? Я вообще не понимаю, зачем вы абсолюты туда навтыкали. 

 

Спасибо, что натолкнули на верный путь! Выставил у блока #menu display:table и убрал у ссылок position:absolute и left - всё стало по центру!