Такие макеты обычно требуют интенсивного использования Javascript. Один из способов добиться того, что вы пытаетесь создать N столбцов, и динамически заполнить их с помощью JS + скрыть/показать столбцы с помощью запросов @media. В этом случае HTML бы что-то вроде этого:
<div class="content">
<div class="column">
<div class="post">
...
</div>
<div class="post">
...
</div>
</div>
<div class="column">
<div class="post">
...
</div>
<div class="post">
...
</div>
</div>
</div>
На $(window).resize()
(JQuery) нужно добавить или удалить column
с и повторно организовать post
сек в зависимости от их ширины и высоты. И вы будете использовать запросы средств массовой информации, чтобы установить ширину отображаемых столбцов, в значительной степени, как так:
@media all and (max-width:1000px) {
.column{width:50%;} /*that would make two equal columns
when the screen width <=1000 */
}
@media all and (max-width:1500px) {
.column{width:33.3333%;} /*that would make three equal columns
when the screen width <=1500 */
}
.post {width:100%;}
.column {float:left;}
Если бы вы предоставить более подробную информацию - вы получите более подробный ответ и меньше downvotes.
ok! Я попытаюсь проверить медиа-запросы. – markobarna