Расположение блоков друг под другом в несколько колонок

[dropoff]

Привет всем.

Не могу понять как сделать так как на скрине

скрин http://s50.radikal.ru/i129/1103/96/49082ab6107c.gif

Это будут ссылки категорий новостей. У категорий есть подкатегории.

Генерация вывода идет через smarty

{foreach name=aussen item=news from=$news_data}
<div class="block1">
<a href="{$news.LINK}">{$news.TITLE}</a> //  категория первого уровня
	<div class="block2">
	{foreach key=key_data item=subnews_data from=$news_data.sub}
	<a href="{$subnews_data.LINK}">{$subnews_data.TITLE}</a> //  категория второго уровня
	{/foreach}
	</div>
</div>
{/foreach}

Вот нужно, чтобы все block1 шли друг за другов в три или более колонок

Пробовал использовать capture, но что-то не работает с ним вообще вывод.

Помогите советом пожалуйста. А то с 7 утра бьюсь.

Заранее спасибо.

[Great Rash]

Если блоки разной высоты, то никак. Если только суммировать высоты блоков и если сумма больше высоты окна, то начинать новую колонку. Но это бред...

[dropoff]

Да. Все блоки разной высоты. Где-то есть подкатегории, где-то нет, где-то их 20, а где-то 1.

Вот с этим и проблема.

Edited March 23, 2011 by dropoff

[SelenIT]

-moz-column-count/-webkit-column-count в соответствующих браузерах... для остальных, AFAIK, только скриптами. Вот здесь какой-то, судя по отзывам, неплохой вариант на JQ предложили...

[dropoff]

Точно! Masonry.

Я не мог вспомнить как называется.

Сейчас попробую. Спасибо.

Жаль, что на чистом CSS не выходит кроссбраузерно.