一般的な DIV + CSS 3 列レイアウト_html/css_WEB-ITnose

===== ===============
上記のHTMLの配置がポイントです。真ん中のContainerには左、中、右の3つのDIVのコンテンツが入っており、本文には左、中、右のソースコードが入っています。 HTMLでの並び順は左、右、コンテンツの順です。左の Div と右の Div に float:left(right) を設定しているため、IE と Firefox のブラウザは左と右の位置の後で、最後の中央のコンテンツが再びキューに入れられます。 left:200px;margin-right:200px; の場合、左右のブロック幅が空になります。

最後に、フッターが下部に正しく表示されるように、DivFooter の clear:both; 属性を設定して float 属性をクリアする必要があります。この属性を設定しないと、フッターが上に浮き上がってしまいます。また、Firefox が CSS シーン全体に設定する高さは、下部のフッターに影響するほか、パディングとマージンの判断も IE と Firefox で大きく異なるため、設定が異なります。この点には注意してください。より複雑なパターンを繰り返し設計すると、このような問題に遭遇することがありますが、これを知っておくと扱いやすくなります。これは単なる足し算、引き算、引き算の算術問題にすぎません。

また、Firefox は text-align: center; CSS 設定を受け入れないため、従来の