Как разместить статьи разной длинны?

Question

[skoff-ua]

Всем привет, нужна ваша помощь.
Есть блог со статьями, нужно разместить статьи в 3 колонки, но чтобы следующие статьи, которые будут добавлены, размещались под уже существующими, слева направо.
Вот наброска для експеремента: нажмите сюда
Я не знаю как сделать многоуровневое размещение этих статей, если поскролить тот пример что я привел, то видно, что последняя статья становиться вниз под последнюю. почему так?

Answer 1

[bio]

Если нужно что бы блоки размещались цельными строчками, то нужно просто заменить
float: left;
на
display: inline-block;

Если нужно что бы блоки размещались в пустые места под другими блоками то можно попробовать masonry.desandro.com

Answer 2

[Дмитрий]

Попробуйте библиотеку Masonry

Answer 3

[Billy Milligan]

Если я правильно понял Вы хотите сделать как в гугл+?

Вам тогда нужно 3 div, а в них уже выводить статьи.
Что бы они бы ли в той последовательности в которой Вы описали, нужно их распределять по колонкам PHP(любой другой ЯП).

Пример:

$news; //массив со статьями
    $col = 3; //количество столбиков

    for($i=0 ; $i<count($news) ; $i+=$col) {
        echo $news[$i]; //Грубо говоря вывод в 1 столбец
    }

    for($i=1 ; $i<count($news) ; $i+=$col) {
        echo $news[$i]; //вывод в 2 столбец
    }

    for($i=2 ; $i<count($news) ; $i+=$col) {
        echo $news[$i]; //вывод в 3 столбец
    }

Можно сделать ещё лучше, но для понимания упростил.