Вертикальное выравнивание пунктов меню

[Bassline]

Пытаюсь сделать вот такое меню http://jsfiddle.net/j7cQW/6/

Суть в том, что текст в каждом пункте меню должен автоматически выравниваться вертикально по середине, независимо от того, одна там строчка или две, то есть сегодня там одна строчка, завтра их может стать две. Плюс, это все обязательно должно быть кроссбраузерным начиная с IE7+.

Мой пример работает только в современных браузерах. Уже всю голову сломал. Возможно проблема решается элементарно, но я не вижу хоть убей.

Edited April 2, 2014 by Bassline

[Q4Dizzy]

Можешь попробовать написать мини скриптик для позиционирований элементов в ие 7. людей, которые им пользуются - очень мало, а сайт это грузить не будет, так как скрипт будет запускатся только у ие 7.

[npofopr]

для IE7 http://tanalin.com/projects/display-table-htc/

[Great Rash]

http://htmlforum.ru/index.php?showtopic=19320

[Bassline]

http://htmlforum.ru/index.php?showtopic=19320

Спасибо за решение.

Нашел еще похожий способ http://habrahabr.ru/post/71236/ - здесь не нужно использовать зум и инлайн для ie7.

А я просто добавил вспомогательному блоку display: inline-block;  width: 0;  overflow: hidden;  vertical-align: middle; - вроде работает везде без всяких хаков.

[Great Rash]

Зум + инлайн нужны для того, чтобы выравнивать любые элементы (<div>), а не только изначально инлайновые (<span>).

[Bassline]

Зум + инлайн нужны для того, чтобы выравнивать любые элементы (<div>), а не только изначально инлайновые (<span>).

Да, что-то я стормозил, совсем забыл что использовал везде span'ы.

Edited April 3, 2014 by Bassline