Верстка меню

[xayleks]

Доброго всем дня.

Прошу помощи в верстке, не как не могу понять как оптимальнее сверстать меню.

Меню построено таким образом что один пункт состоят из 2 ячеек, в первой фоновое изображение (ну скажет товара)

Вторая ячейка содержит фоновое изображение и центрированный (вертикально+горизонтально) текст ссылки.

И самое главное что обе ячейки пункта должны быть ссылкой.

[mrnobody]

Вот так примерно http://jsfiddle.net/UTsHW/

Еще дорабатывать нужно.

[xayleks]

Вот так примерно http://jsfiddle.net/UTsHW/

Еще дорабатывать нужно.

Спасибо огромное!

Сделал немного раньше чем вы написали, но остался открытым вопрос как отцентрировать текст в блоке, если в некоторых блоках текст в одну строку. а в некоторых в две.

[mrnobody]

Родительскому элементу, в котором лежат блоки с текстом задайте свойство text-align: center. Ил вы имеете ввиду вертикальное выравнивание?

Если нужно вертикально выровнять несколько строк, то родителю задать свойство display: table; а блоку с текстом display: table-cell;.

[xayleks]

Родительскому элементу, в котором лежат блоки с текстом задайте свойство text-align: center. Ил вы имеете ввиду вертикальное выравнивание?

Если нужно вертикально выровнять несколько строк, то родителю задать свойство display: table; а блоку с текстом display: table-cell;.

В принципе я так пробовал делать. Т.е я li задаю свойство display: table;

А span задаю display: table-cell; и vertical-align: middle;

Все отлично это действительно работает, но к сожалению только не для IE. (-:

Нужно именно кроссбраузерное решение.