Уравнивание содержимого между столбцами

Question

Я ищу оптимизированный способ отображения динамически сгенерированных элементов, отсортированных и сгруппированных по инициалам (например, на изображении ниже). Группы могут иметь различное количество элементов, и поэтому общее количество элементов неизвестно.

Что было бы лучшим решением для распространения групп по столбцам (они должны оставаться отсортированными)?

В настоящее время группы и элементы генерируются из php и распространяются по столбцам (div), которые содержат группы и элементы в элементах ul и li.

https://www.dropbox.com/s/ub3mg3twm0eg8b6/columns.jpg

Спасибо заранее,

Answer 1

Вы можете использовать CSS3 столбцы https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_multi-column_layouts и это будет работать как polyfill https://github.com/BetleyWhitehorne/CSS3MultiColumn

Answer 2

Поскольку это выглядит просто нужно толчок, чтобы начать его, что я бы делать. Поскольку ваши столбцы динамически Я предполагаю, что вы используете PHP для этого вам необходимо:

1. Count каждый элемент в столбцах
2. Граф все элементы на всей странице
3. Divide что три
4. Затем вы будете выводить первую треть до последнего элемента последней группы
5. Подсчитайте все элементы в первом столбце
6. Следующий выход, начиная с первого элемента новой группы и выводит столько элементов, сколько в первом группа ex исключающее последней группе
7. выхода остальных элементов в последнем столбце де-

нуждается в некоторой настройке, конечно. Удачи!