html - 複数のインライン垂直リストを水平にオーバーフローさせる

Question

サイトの下部に情報バーがあります。水平方向に表示されるいくつかのインライン ブロック要素があります。フィドルでわかるように、インライン ブロック要素の情報が垂直方向に大きくなりすぎると、情報バーの下端からはみ出します。新聞のコラムのように右にオーバーフローさせたい。

jsfiddle:リンク

<div class="information-bar">
    <div class="information">
        <div class="title">Section Title</div>
        information <br />
        information2 <br />
        information3 <br />
        information4 <br />
        information5 <br />
    </div>
    <div class="information">
        <div class="title">Section Title</div>
        information <br />
        information2 <br />
        information3 <br />
        information4 <br />
        information5 <br />
    </div>
</div>

目標は、これを変換することです。

これに：

私はcss3列の方法を試しました: jsfiddle。残念ながら、これは1つの列でのみ動作するように設計されていると思います.