css - フローティング div が他の div を正しくプッシュしない

Question

CSSに関しては専門家ではありませんが、フローティングdivを機能させようとしています。私は 2 つの div を持っています。上の 1 つは左にフロートし、もう 1 つの div は右に折り返す必要があります。だいたいこうするようです。問題は、正しいように見えても、実際にはボックスを右側に押していないことです。私は jsfiddle を持っています。私の言いたいことがわかるでしょう。content という div に赤い枠線を設定しました。コンテンツはほぼ正しいように見えますが、h1 の下の赤い点線は、H1 タイトルの下ではなく、フローティング オブジェクトの先頭から始まります。理解を助けてください。ここにjsfiddleがあります：http://jsfiddle.net/wCnY3/

<div id="subNav">box</div><div id="content">WELCOME</div>

Answer 1

#contentプロパティで要素をターゲットにしますoverflow-x:hidden。

#content {
    overflow-x:hidden;
}

そのように：http://jsfiddle.net/wCnY3/1/

設計上、 にoverflow:hiddenは要素が正方形/長方形のように動作するように強制する効果があります。要素の幅/高さが設​​定されていないため、それは単にラッピング動作が変更されたことを意味します。