Div элементы с float:left разной ширины друг под другом?

[sunyang]

Здравствуйте.
вот пример накатал:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

Все дивки с float:left и разной высоты
видите - три последних дивки перенеслись на новую строку, но между первыми тремя и последними пустота. Как сделать, чтобы не было пустот?
Хочу сделать как в обычной газете: несколько колонок, в них объявы одной ширины, но разной высоты, но чтобы не было между ними пустот после добавления новой.
Как реализовать можно?

 

[latteo]

Почитай решения на хабре
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся

 

[Exquisitor]

.centerdiv div {
border: 1px solid #FF0000;
float: left;
margin:10px 1px(0);
width: 120px;
}
за это все отвечает маргин и ширина каждого блока

 

[sunyang]

Я так понял у нижних блоков нужно ставить минусовой margin, вот только как теперь его расчитывать для последующих блоков)

 

[Exquisitor]

Я так понял у нижних блоков нужно ставить минусовой margin, вот только как теперь его расчитывать для последующих блоков)

Ниче не понимаю) зачем только у нижних? это две строки нужно? или как? или нужно чтоб была одна строка с дивами разной высоты, потом создавать следующую строку?? нужно всем блокам поставить margin-left и margin-right как можно меньший - это будут расстояния слева и справа.
если построчно:

<div style="position:relative; min-height:150px;">
 
    <div style="float:left; height:140px; width:150px; margin:10px 0;">140px</div><div style="float:left; height:190px; width:150px; margin:10px 0;">190</div>
 
</div>
 
<div style="position:relative; min-height:150px;">
 
    <div style="float:left; height:160px; width:150px; margin:10px 0;">160px</div><div style="float:left; height:190px; width:150px; margin:10px 0;">190</div>
 
</div>
 
<div style="position:relative; min-height:150px;">
 
    <div style="float:left; height:140px; width:150px; margin:10px 0;">140px</div><div style="float:left; height:190px; width:150px; margin:10px 0;">190</div>
 
</div>
 
<div style="position:relative; min-height:150px;">
 
    <div style="float:left; height:160px; width:150px; margin:10px 0;">160px</div><div style="float:left; height:190px; width:150px; margin:10px 0;">190</div>
 
</div>

 

[sunyang]

вощем это сложно автоматизировать через скрипт. Поэтому сделал дивы с фиксированной высотой.

 

[Kaiserdc]

не вижу вашего примера, т.к. он скрыт, но если я правильно понял проблему то может помочь вот этот скрипт
Для просмотра ссылки Войди или Зарегистрируйся