２−５ 「float」によるCSSレイアウトの崩れを防ぐ
<div>を「float （回り込み）」を使って左右に配置し、「width （横幅指定）」を使ってCSSレイアウトを作りましたが、実は、「float （回り込み）」を使ってレイアウトを構築した場合レイアウトが崩れることがあります。
そこで、「float」を使ったCSSレイアウトの崩れを防ぐ方法を説明します。
「clear」（回り込み解除）と「width」（横幅指定）でレイアウトの崩れを修正
「float （回り込み）」を使ってレイアウトを構築した場合、
左右に配置した<div>の次の<div>へ
「clear : both」で回り込み解除
「width」で横幅指定
これで、レイアウトの崩れを防ぐことができます。
必ず忘れないようにしましょう。
ホームページソース
<head>
<title></title>
</head>
<body>
<div id="site-box">
</div>
</body>
</html>
width : 750px;
}
float: left;
width: 500px;
}
float: right;
width: 250px;
}
clear: both;
width: 750px;
}
Yahoo!ブックマークに登録
（「まぐまぐ」にて殿堂入りしました）
ホームページ作成を一人で頑張るのもいいですが、仲間と一緒に頑張りませんか？
人気ホームページの作り方やホームページ運営者の生の声などの情報を発信していますので、ぜひあなたも購読してみてください。
こんなヤツ！
ホームページを作っていたら、この楽しさを、あなたに伝えてくなりました。ホムつく式のホームページの作り方を体験してみてください。
→プロフィール
→お問い合わせ
必要なものは？
ホムつく講座がおすすめするソフトやレンタルサーバーを紹介しています。初心者の方や、悩んでいる方は是非参考にしてみてください。
ホームページはXHTMLとCSSで作ります。ほむつく講座では初心者の方にわかりやすいと評判の初心者講座があります。
良くしたい
ホムつく講座では見た目だけが良いデザインではなく、ユーザー（利用者）の方が安心して、ホームページを閲覧できるデザインを学べます。
ホームページは作れば沢山のアクセスが集まるわけではありません。そして、アクセスが多いだけのホームページでも意味がありません。あなたのファンができる人気ホームページを作り方を学びましょう。