對齊浮動div頂部到底部

Question

我有一個文章標籤，內部生成wordpress的文章的php代碼。它們並不完全相同，它取決於內容。他們按浮動兩列組織。

如果第一行中的文章與同一行中的另一篇文章的高度不同，第二行將與biger div的底部對齊。現在我想對齊它們而沒有任何間距。

下面是一些CSS：

#container { 
width: 1000px; 
margin: 0px auto; 
} 

article { 
position: relative; 
width: 435px; 
margin: 10px 10px; 
background-color: rgba(0, 0, 0, 0.5); 
padding: 20px; 
float: left; 
} 

編輯的jsfiddle（現在的內容來演示該問題）：http://jsfiddle.net/4PMj5/6/

Answer 1

您可以使用even和odd孩子僞選擇在你的CSS。

article:nth-child(even) { 
    position: relative; 
    width: 435px; 
    margin: 10px 10px; 
    background-color: rgba(0, 0, 0, 0.5); 
    padding: 20px; 
    float: right; 
} 
article:nth-child(odd) { 
    position: relative; 
    width: 435px; 
    margin: 10px 10px; 
    background-color: rgba(0, 0, 0, 0.5); 
    padding: 20px; 
    float: left; 
} 

結果如下：this updated fiddle。