Все еще немного неясно, каковы ваши точные требования к центрированию (как, например, все ваши иллюстрации выше показывают четное число элементов, поэтому я не знаю, чего вы ожидаете от нечетного числа. В вашей скрипке япросто добавил text-align: center
к ul
и добился центрирующего эффекта (http://jsfiddle.net/nR9Mk/1/), но я не знаю, ведет ли он себя так, как вам хочется.
Обновление : если вы имеете дело только с четными числами и хотите, чтобы они оставались сгруппированными по двум, то это будет работать: http://jsfiddle.net/nR9Mk/8/.
КРУГЛЫЙ 2 : на основе вашего раскрытого "нечетного"Требования к нумерации, я придумала решение, которое работает. Примечание: 1) оно требует некоторой дополнительной разметки HTML, 2) вам нужно установить какой-то практический предел того, насколько широко вы хотите идти, и при этом получить эффект. Здесь - это код с элементами «буфера», которые открываются с помощью outline
, а здесь - это с удаленным контуром.
КРУГЛЫЙ 3 : Я знаю, что вы уже приняли мой ответ, но я уже работал над этим, поэтому я решил, что предложу его в любом случае.На основании вашего комментария о нарушении условий сделки представляет собой измененный план , который может быть полезен вам (или кому-то еще).Это гибрид - «иногда» он выталкивает элементы влево (обычно, когда это было бы очень неудобно, чтобы не делать), а иногда позволяет им оставаться «вне колонки», но центрироваться.Чтобы это не выглядело просто "странно", ему дают max-width
из шести столбцов в ширину.