0

私は基本的な構造を持っています

<div class="container">
    <div class="sidebar">
    </div>
    <div class="content">
    </div>
    <div style="clear:both;"></div>
</div>

どこ.sidebar.contentいてfloat: left

SOであまりにも多くの回答を見てきましたが、それらはすべて.content画面自体より大きくない場合にのみ機能します。私の問題を説明するために、この2つの例があります

http://jsfiddle.net/pleasedontbelong/h35vc/2/ (小さなコンテンツ) http://jsfiddle.net/pleasedontbelong/56C9v/1/ (大きなコンテンツ)

ご覧のとおり、.contentdiv が大きすぎるheight:100%と、コンテナーの が機能しなくなります。

どちらの場合も、灰色の div は 100% の高さにする必要があります。私の推測では、ブラウザーは要素をフローティングする前にウィンドウの高さを計算します。

CSSだけで解決できるでしょうか?(私はJSでそれを行うことができましたが、あまりにも汚いようです)

4

4 に答える 4