Элементы списка рендеринга CSS в 2 ряда

Question

Допустим, у меня есть серия

элементов, предназначенных для рендеринга с помощью float: оставленных внутри контейнера фиксированной ширины, следующим образом:

Item 1 | Item 2 | Item 3 | Item 4
| Item 5 | Item 6

Это нормально, пункт 5 и пункт 6 перенесены во второй ряд, поскольку контейнер имеет фиксированную ширину.

Теперь, возможно ли иметь что-то похожее на вышеперечисленное, кроме того, что большинство элементов будет отображаться во втором ряду? Что-то вроде:

Item 1 | Item 2 
| Item 3 | Item 4| Item 5 | Item 6

По сути, я хочу визуализировать список элементов по горизонтали, перенося во второй ряд по мере необходимости, но с большинством элементов во втором ряду, если он существует. Количество создаваемых элементов может варьироваться, но не должно превышать 2 строки.

Answer 1

Не без того, чтобы либо вручную определить, какой элемент начинает новую строку (с clear: both;), либо с помощью javascript, чтобы выяснить, какой элемент должен сломаться, а затем сделать то же, что и выше.