css - フローティングカラム：右フロートを開始する前に、左フロートをロードする必要があります

Question

1つの列が左にフロートし、2つのDIVが右にフロートする2列のレイアウトを作成しようとしています。右側の2つのDIVの合計は、左側のDIVの高さよりも低い高さです。これを可能にするCSSが欠けていると思います。現在のところ、高さの違いにより、右から2番目のDIVが左のDIVの端の下に表示されています。

問題を確認するには、ページ自体を表示する方がおそらく簡単です。すべてのテキストがボックス内にあるように見えるように、DIVで適切なコンテンツの最後を閉じる必要があります。

http://brimbar.com/no_crawl/RiverHollow/history.html

これを達成するために負のマージンを追加することはできますが、これはすべて間違っていると思います。

Answer 1

右側のdivfloatの両方（または、さらに追加する場合はすべて）を解除し、それらをラッパー内に配置してから、そのラッパーにmargin-left左側のdivの幅に相当する値を指定します。

スクリーンショット：http ：//easycaptures.com/fs/uploaded/677/0314515048.png

デモ： http： //jsbin.com/aviyok/1/edit

また、右側のコンテンツdivの大きな負のマージンを削除する必要があります。それは非常に簡単に壊れます。