※ ChatGPTを利用し、要約された質問です(原文:FIREFOXでのCSS表示)
FIREFOXでのCSS表示
このQ&Aのポイント
FIREFOXでのCSS表示に関する効果的なレイアウト方法とハックについて解説します
FIREFOXでのCSS表示についての課題を解決する方法について詳しく説明します
FIREFOXでのCSS表示におけるメニューとメインコンテンツのボリューム調整方法についてまとめました
よろしくお願いします。
CSSのレイアウトで、よくある2カラムのオーソドックなもの
左側にメニュー、右側にメインコンテンツ、上下にヘッダ・フッタ
<div id="wall">
<div id="header"></div>
<div id="menu"></div>
<div id="main"></div>
<div id="footer"></div>
</div>
のような構造の場合、メインコンテンツは各ページによってボリュームが違うので、wall部分もmainのボリュームにあわせて変化させたいです。
IEならば問題ないのですが、FIREFOXだとmenuやmainの部分が増えると、wallの上から重なるように表示されてしまうケースがありました。はみ出ています。
このような場合、それぞれのheightの設定など、どのようにしたら良いのでしょうか? mainの長さにあわせて最後にwallを1250pxのように具体的な長さ指定すると、見た目にはfirefoxでもうまく表示はされています
(ただし、このやり方だと各ページのコンテンツの長さにあわせて、1つ1つ設定しないといけない)
floatの設定なども含めて、どういった記述をすれば良いのか、どなたか教えてもらえませんでしょうか。