コーディングで「float」のclearの仕方

質問

htmlとcssのコーディングに関して質問させてください。

右側と左側にボックスをフロートさせた際、
どうやって回り込みを解除したらよいのか教えてください。

▼htmlのタグ
<div id="left">......</div>
<div id="right">......</div>

▼cssのタグ
#left{float:left; width:100px;}
#right{float:right; width:100px;}

このようなコーディングをした際には、
html、もしくはcssのどちらに、どのようなタグを
追加して回り込みをなくしたらよろしいでしょうか？
分かりにくいかもしれませんがご教授いただければ幸いです。

回答No.1

naokita

▼htmlのタグ
<div id="left">......</div>
<div id="right">......</div>
<div class="clear">......</div>

▼cssのタグ
#left{float:left; width:100px;}
#right{float:right; width:100px;}
.clear{clear:both;}

clear:both;　で解除するわけだから、Divでなくても良いですし、 br や hr に clear を設定しても可能。　clearの方法は他にもありますし、環境によっては問題もあるので自分に合った環境で調べて下さい。

お礼

ありがとうございます。勉強になりました。