3つのdivをフレックスボックスなしで並べる

Question

3つのdivを並べて配置するのは苦労しています。私はそれをChromeで動作させることができましたが、他のブラウザをテストすると、すぐに地獄に行きました。

は、私が利用可能な領域の100％を取るために最初のdivを必要とし、第二のdivは、静的な幅を有する（160ピクセル）、および第三divが幅にする必要がある。しかし、私は技術的にすることができます（内部のコンテンツのサイズに応じて、自動静的な幅でも動作させる）。

これは私が試してみました何をされています

.row { 
    display: table; 
} 

.col { 
    display: table-cell; 
} 

をあなたがここにコード全体を見ることができます：https://codepen.io/anon/pen/RLjGab

見ての通り、これはChromeでいや問題なく動作しますが、他のブラウザでできるだけ早く私は行の高さが定義されたより大きい欄の中に何かの内容を入れました、そして、なぜ私は本当に苦労しているのか分かりません。

フレックスボックスはIE9でも動作する必要がありますが、フレックスボックスは使えませんが、誰かが少なくともこれをどのように正しい方向に向けることができたらすばらしいでしょう。事前

Answer 1

で

おかげで私は、私はちょうど彼の列にvertical-align: middle;を追加するために必要な、それを考え出し、それはそれを修正しました。