1列を2に変える

Question

私は約10個のdivを持つコンテナdivしか与えないという問題に遭遇しました。私はdivを追加せずにdivのこの1列を2列にする方法を見つけたいと思います（つまり、左側の列または右側の列にdivを追加しない）。私はできるだけ早くCSSソリューションを探したいと思っています。

<div class="container"> 
    <div>1</div> 
    <div>2</div> 
    <div>3</div> 
    <div>4</div> 
    <div>5</div> 
    <div>6</div> 
</div> 

理想的な出力：

1  2 
3  4 
5  6 

私は、フローティングと浮気しようとしたが、それはあまりにもうまく動作しませんでした。私にお知らせください。ありがとう！

Answer 1

このように：http://jsfiddle.net/Qzj2d/？それは最も簡単な解決策です（必ずしも必要ではありません）。

Answer 2

内側のdivをコンテナの幅の半分に設定して浮動させます。例えば

.container { width:600px;} 

.container div { 
    width:300px; 
    float:left; 
} 

の作業例http://jsfiddle.net/k2tQG/

Answer 3

私は、要素の高さが異なる場合がありますのでdisplay: inline-blockが、floatよりも優れていると思います。しかし、font-sizeを0に設定して.containerに設定し、要素でリセットする必要があります。私はより適切な解決策が既にここに掲載されていて、サポートが重く、私はするつもりですが、あなたは新しいCCS3を使用して任意の数の列に任意のdiv要素を分離することができ、提案のために不足していることを知っている

jsfiddle example

Answer 4

列カウントと列ギャップのプロパティ。

これへのリンクはここで見ることができます：

http://www.quirksmode.org/css/multicolumn.html

私は、これらの特性が真の「印刷スタイル」のレイアウトを可能にするため、このためのサポートが非常に低いことが、非常に失望し、私たちをサポートしている場合クリアする必要はありません：親divと子divを正しく整列させるためです。私はここにワームの缶を開けていることを知っていますが、これははるかに使いやすいオプションです。

私は非常に多くの人が列のレイアウトについて尋ねるので、どうしてなぜそこにあるテクノロジを使うことができないのですか？暴言のため申し訳ありません