css - コンテナー Div が内部 div コンテンツに展開されない

Question

私は一晩中探していましたが、この質問または同様の質問が以前に投稿されているのを見たので、何か間違ったことをしているに違いありません. もう一度質問する必要があることをお詫びします。

他の div を保持するコンテナ div がありますが、これは内部の div コンテンツで展開されていません。コードはここにあります: http://jsfiddle.net/pR7bq/

高さを削除できません: 100%; より少ないコンテンツに対応する必要があるため、#container から。私は使用の言及を見ました

<br style="clear:both" />

しかし、私はそれを間違って使用しているか、機能していません。ここで、同じまたは同様の問題に対するこのよく書かれた回答を見つけました：「clearfix」のどの方法を使用できますか? 、しかし、コードをどこに置くかについて途方に暮れています。私の最善の試みは失敗に終わりました。オーバーフロー属性も使用してみましたが、それが理にかなっていれば、ページではなく div にスクロールバーを表示したくありません。

私はすべての助けに感謝し、事前に感謝します.

Answer 1

これをコンテナのスタイリングに使用します。

#container{
    width:80%;
    background:#f6f6f6;
    height:auto;
    margin: 0 auto;
}   

高さ自動を使用することにより、ブラウザーは、そのすべての子をカバーする要素の高さを決定しようとします。

height: 100% を使用すると、要素コンテナーの親の高さに基づいて高さが決定されます。

Answer 2

今では高min-heightさではないことに慣れています

このように

#container{
height:100%; // remove this line
min-height:100%; // add this line 
}

ライブデモ

Answer 3

私は通常、CSSでこのようなクラスをスローします

.iefix{ clear: both;font-size: 1px;}

次に、IEで動作していないdivの下のdivにスローします

<div class="wrap">
    <div class="left">
    </div>
    <div class="right">
    </div>
    <div class="iefix"></div>
</div>

Answer 4

高さ自動を使用するか、高さを定義しないで問題を解決してください