CSSレイアウト崩れの原因 - 閉めのDIVタグの過不足
CSSでのレイアウトは、DIVタグを入れ子にしてパーツを構成していきますが、コンテンツを盛り込んでいくといくつものDIVタグが重なりあい、その結果、DIVタグを閉じるのを忘れてしまったり、どれがどのDIVタグの閉めなのか分からなくなったりしてしまいます。
右のイラストは、DIVタグを閉め忘れた際に生じる崩れの例です。
DIVタグが閉まっていないことで、本来右に来るべきサイドバー（メインスペース部分より下に記述したHTML）が、メインスペースの枠の中に入ってしまうことで、このような崩れが生じてしまいます。
このような崩れを起こさないよう、あらかじめ閉めのDIVタグに「目印」をつけておきましょう。
しかし、ただ目印をつけたのではブラウザ上にも表示されてしまいますので、「コメントアウト」を利用してこれを記載します。
[閉めのDIVタグを忘れないための目印のつけ方]
<div is="mainWrap"> ～～～ </div><!-- mainWrap終わり -->
このように、テキストを「<-- ○○○○ -->」と囲ってあげることで、ブラウザには表示されないようにすることができます。
閉じるDIVタグを忘れてしまうと、後からどのDIVタグの閉めが抜けているのか調べるのは大変ですし、それ以前にDIVタグを閉め忘れていることに気づかなかったりするので、しっかり目印をつけておくことをオススメします。