css - 将 div 排成行

Question

我试图让这些 DIV 以两个为一组从左到右“流动”，然后对于每个奇数，在我客户的 Joomla 站点中创建一个新行(参见此处 http://centralcat.socialhippo.com/services/available-for-adoption.html我有前两个工作，但当第三个被渲染时，它会向右移动而不是向左浮动。我没有与 CSS 结合，所以如果有更好的方法(列表等)，我会试一试。

Answer 1

只需在#cat2adopt 中添加一个高度即可快速解决此问题。只需确保高度足以容纳内容即可。当您以不同的高度 float div 时，就会出现此“问题”。

您还应该在此处使用类，因为 ID 必须是唯一的。

例如:

.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;
}