Горизонтальное центрирование элементов многострочного списка в неупорядоченном списке - PullRequest
Новая
       29

Горизонтальное центрирование элементов многострочного списка в неупорядоченном списке

22 голосов
/ 12 февраля 2011

У меня есть неупорядоченный список, который переносится на вторую строку, и его необходимо отцентрировать по горизонтали внутри содержащей UL.Каждый LI имеет заданную ширину и высоту.Я видел много подходов, которые работают для одной строки, но ничего, что я пробовал, не работает, когда список переносится на вторую строку.Было бы идеально, если бы это работало в IE7 + - Спасибо за помощь.

См. Здесь для иллюстрации:

illustration http://grab.by/8UIl

1 Ответ

34 голосов
/ 12 февраля 2011

Вот лучший метод, который я смог найти. 

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/

...