Горизонтальное центрирование элементов многострочного списка в неупорядоченном списке
У меня есть неупорядоченный список, который переносится на вторую строку и должен быть расположен по горизонтали внутри содержащего UL. Каждый LI представляет собой заданную ширину и высоту. Я видел много подходов, которые работают для одной строки, но ничего, что я пробовал, работает, когда список обертывается во вторую строку. Было бы идеально, если бы это работало в IE7 + - Спасибо за помощь.
См. здесь иллюстрацию:
http://grab.by/8UIl
Ответы
Ответ 1
Вот лучший способ, который я мог найти.
ul li {
/* make list elements fall inline as block elements */
position: relative;
display: inline-block;
/* next two lines only for display purposes */
text-align: center;
border:1px solid red;
}
/* horizontally center ul element */
ul { text-align:center; }
См. ссылку для примера: http://jsfiddle.net/gfkPG/