2013-03-15 76 views
0

我有兩個div,都是多列布局。我想將它們並排放在一起,但我嘗試的所有東西(比如浮動)都會弄得一團糟。 我認爲問題在於width:auto;佔據了所有的寬度。CSS3並列多列布局的兩個div的寬度

我已經做了的jsfiddle更好地說明:http://jsfiddle.net/2fPZ2/

紅色和紫色的div應該是在同一直線上。

結果必須是水平佈局,其中部分是紅色和紫色的div。 有什麼建議嗎?

+0

Vucko寫的解決方案是好的,但我需要的紅色背景(它實際上將擴大,因爲有剩餘空間),以適應列,因爲它們必須處於滾動行中。 你認爲這有可能嗎? – Edoardoo 2013-03-15 18:50:18

回答

1

只需將-webkit-column-count:2添加到.container即可。

CSS

.container{ 
    height:100%; 
    width:100%; 
    position:relative; 
    background:red; 
    -webkit-column-count: 2; 
} 

JSFiddle

更多:column-count

+0

謝謝,但列號是動態的。它是流體佈局的一部分。 – Edoardoo 2013-03-15 15:39:36