проблема с потоковым выводом блоков

[oneiro]

Добрый день.

Возникла проблема при выводе разных по высоте блоков в одном потоке.

Блоки выводятся в строчку по три штуки. Ширина блоков задается в процентах. Некоторые блоки имеют большую высоту, чем другие из-за длинной подписи под изображением. Проблема возникает при выводе следующей строчки блоков - блоки почему-то смещаются на один вправо, именно там, где верхний блок имел большую высоту.

Лучше посмотреть тут собственными глазами:

http://www.genstroyspb.ru/projects/test.php

Стиль блоков:

.tarasov-gallery {
position: relative;
background:#ccc;
display: inline;
float: left;
margin: 0 1% 30px;
text-align: center;
width: 31%;
} 

Самое любопытное, что на другом сайте, откуда берется контент, эта проблема отсутствует. Я пробовал играть и с марджинами, и с размером шрифта, все бесполезно. Не пойму что нужно сделать, чтобы блоки выводить один под другим без пропусков...

[tt48]

был бы еще примерчик где работает)

по сути - все корректно: блоку сказали обтекать и он обтекает( там же margin еще снизу у высокого блока).

можно оборачивать по три элемента в блок

или каждому 4-му назначить clear: left;

Последний вариант, имхо, лучше,)

Edited May 16, 2011 by tt48

[oneiro]

был бы еще примерчик где работает)

по сути - все корректно: блоку сказали обтекать и он обтекает( там же margin еще снизу у высокого блока).

можно оборачивать по три элемента в блок

или каждому 4-му назначить clear: left;

Последний вариант, имхо, лучше,)

Условия более жесткие: контент подцепляется с другого сервера вставкой на php, так что можно только колдовать со стилями...

Как это выглядит у самого поставщика контента на сайте можно посмотреть здесь. Копался в его стилях firebug'ом - не нашел отличий.. Вот в ступоре и сижу уже второй день.

Идея с clear:left для каждого 4-го блока понравилась. А как ее реализовать на практике? Подскажете код?

Edited May 16, 2011 by oneiro

[tt48]

ну как же нет отличий? там после каждого третьего стоит

<div class='clear'></div>

Чисто на стилях реализовать подцепление каких-либо стилей к n-кратному блоку можно на CSS3.0, тобишь - на IE класть.

Есть же доступ к php-коду? там просто и прописать условие, типо каждому (i%3==0) добавить класс i_am_a_third_one

к примеру.

[oneiro]

ну как же нет отличий? там после каждого третьего стоит

<div class='clear'></div>

Не увидел очевидного. Спасибо!