css,段落ち防止

floatで崩れた？コレでなおせ！| m-School
段落ちするときはちゃんと計算して対処
divのブロックを左右に並べた2段組を作っていて、右のブロックが崩れて下に落ちた！なんてことがあります。所謂段落ちです。
この原因は単純です。親のブロックの幅に、左右にわけたブロックの合計幅が収まらないと、段落ちします。

幅が足りずに段落ちする
きちんと合計幅を計算して、左＋右の合計が、親ブロックを超えないようにします。
このとき、padding,border,marginなどの値もしっかり計算に含めましょう。
このとき、IE6のダブルマージンバグなどにハマらないように気をつけましょう。

m-School
http://m-school.biz/dev/css-coding/047-float-repair.htm






******************************************************************************

#parentBox {
 width: 600px;
 overflow: hidden; /* heightを戻す */
}
#childBox1 {
 width: 200px;
 float: left;
}
#childBox2 {
 width: 400px;
 float: right;
}

******************************************************************************