2014-09-04 60 views
0

http://jsfiddle.net/ny3es0dk/動態浮動2列

#floating_body_container { 
border: 1px solid #ddd; 
padding: 5px; 
float: left; 
width: 450px; 
height: auto; 
margin: 5px; 
background: #eee; 
} 

我想創建僅使用HTML/CSS一個負責任的 「更新流」(儘管在絕對neccesary我可以用js/jQuery的)。問題是,新「線」上的每個新div只會從最後一行的較高div的底部開始。理想情況下,div會轉到其上方較短div的一側。你可以看到jsfiddle上顯示的問題。

謝謝。

回答

1
#floating_body_container:nth-child(even) { 
    float: right; 
} 

解決問題。

+0

它只在這些特定的情況下才會使用這些尺寸。它不會在隨機大小的div上 – Devin 2014-09-05 00:02:45

+0

我已經在實況網站上部署了它,並添加了5個div,它完美地工作。所有不同的尺寸。 – 2014-09-09 00:20:17