CSS - 自動div幅

Question

私は、ページのコンテキストに応じて変更できるhtml構造を持っています。

<div class="container"> 
    <div class="column"> 
    blah 
    </div>  
</div> 

等に：一部のページではのように見えるので、

<div class="container"> 
    <div class="column"> 
    blah 
    </div>  
    <div class="column"> 
    blah 
    </div>  
</div> 

、コンテナは、流体幅（100％）を持っています。

.column divも流動性があり、最初の例ではコンテナの幅を持つ必要があります。 100％、 であり、第2の例では50％幅であり、左に整列している。

同様：

---------------------------- 
|       | 
|   column1   | 
|       | 
----------------------------- 

と

---------------------------- 
|   |    | 
| column2 | column2  | 
|   |    | 
----------------------------- 

私はこれをどのように行うことができますか？

私も、私は（、クラスまたはそのような何かを追加するかもしれない唯一のjavascriptハックを使用するか、PHPの出力をキャプチャして、正規表現を使用することはできませんcolumn1の/ column2の内の任意のマークアップを変更できないことに注意してください:)

Answer 1

私は2つのソリューションを考えることができます。

1. CSS3 flex boxを使用してください。
2. 列をdisplay: table-cell;、コンテナのdisplay: table-row;に設定します。

Answer 2

最高のものは、JavaScript：http://jsfiddle.net/V5Au7/です。

いくつかの非常に厄介な落とし穴：

1. これは#containerの唯一のdivは、クラス名を持つものであることを前提とし、「列。」
2. これは、列に罫線、余白、または余白がないことを前提としています。
3. You could run into sub-pixel problems, by relying on percentages.もちろん、1つまたは2つの列だけを貼り付けると、これはおそらく問題にはなりません。

IE6でも動作するCSS専用の方法があるはずです。私はそれを感じることができます、私はそれを見つけることができません。