Я буду очень благодарен, если кто-нибудь поведет, как это решить:
Описание проблемы: у нас есть Dynamically сгенерированные "плавающие divs" с даже witdh, но даже не с высотами (на основе контента). "Родительский контейнер" будет иметь разные параметры ширины, чтобы позволить 2,3,4 (в прикрепленных примерах 2 столбца и 3) divs соответствовать его ширине. divs порядок слева направо, всегда с помощью hirarchical order 1,2,3 и т.д.
Как мы можем достичь этого, не создавая пробелов? (используется методом традиционных поплавков).
Количество divs динамически создано и не ограничено...
Решение должно быть ie8, ie9 compatible
спасибо, Джонатан. ! [введите описание изображения здесь] [1]
Пример иллюстрации можно найти здесь: https://app.box.com/s/6y89dlan1jt8bpjvcgb9
Вместо плавающего используйте макет столбца.
Этот рабочий скрипт демонстрирует раскладку из трех столбцов, но вы можете легко изменить ее на столбец N.
Для макета N колонок вам необходимо создать N контейнеров, каждая из 100/N ширины, и заполнить их соответственно.
Вам просто нужно построить свой динамический контент в правильном порядке. (каждый раз поместить динамический div в правый столбец).
Здесь основной HTML и CSS для 3-х столбчатых макетов
<div class="Container">
</div>
<div class="Container">
</div>
<div class="Container">
</div>
.Container {
float: left;
width: 31.33%;
margin: 1%;
}
Скрипт в скрипке предназначен исключительно для добавления динамического содержимого. и хотя содержание, которое у меня было фиксированной высоты, оно, очевидно, будет работать и с изменяющимися высотами.
BTW: для раскладки в 2 столбцах вам это не нужно. просто сделайте нечетный элемент поплавок влево, а четные элементы плавают вправо. Как это
Вы считали, что используете что-то вроде масонства?