Поток делится на строки

Question

Я пытаюсь заставить эти DIV «течь» слева направо в наборах по два, а затем для каждого нечетного сделать новую строку на сайте моего клиента на Joomla (см. Здесь http://centralcat.socialhippo.com/services/available-for-adoption.html У меня первые два работают, но когда третий рендерится, он идет вправо, а не всплывает влево. Я не женат на CSS, поэтому, если есть лучший способ (список и т. Д.), Я попробую.

Answer 1

Просто добавьте высоту к #cat2adopt, чтобы быстро решить эту проблему.Просто убедитесь, что высота достаточно велика, чтобы вместить содержимое.эта «проблема» возникает, когда вы перемещаете div с переменной высотой.

Вы также должны использовать классы здесь, поскольку идентификаторы должны быть уникальными.

например:

.cat2adopt { /* class="cat2adopt" */
    clear: right; /* don't really need this I don't think */
    float: left;
    height: 300px; /* added this */
    margin-bottom: 20px;
    margin-right: 20px;
    position: relative;
    text-align: center;
    width: 400px;
}