省略 headerの内容左側の内容右側の内容 footerの内容といった感じのトップページをCSS+htmlで作りました。見てわかる通り、が無駄にたくさんあります。でもこの無駄がないとの内容を無視して、の縦の長さが0みたいに表示されてしまいます。だからの縦の大きさを数値で指定すると上手くいくのですが、可変するようにしたいのでautoにして、結果無駄をたくさん記述するはめになっています。以前こちらでの入れ子が上手くいかない時に clear: bothを入れると良いと聞いて入れ子構造は出来たのですが、今度は無駄がないと入れ子にした際に（縦をautoにした場合）外側のdivが表示されないという状況です。わかりづらい説明で申し訳ないのですが、何かが間違ってるせいだと思うのでわかる方宜しくお願いします。

divについて。

解決済

質問者：osieosiete
質問日時：2007/06/19 15:40
回答数：1件

<html lang="ja">
<head>省略</head>
<body>
<div id="header">headerの内容</div>
<div id="main">
<div id="left">左側の内容</div>
<div id="right">右側の内容</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
<div id="footer">footerの内容</div>
</body>
</html>

といった感じのトップページをCSS+htmlで作りました。見てわかる通り、<br>が無駄にたくさんあります。

でもこの無駄<br>がないと<div id="left">の内容を無視して、<div id="main">の縦の長さが0みたいに表示されてしまいます。
だから<div id="main">の縦の大きさを数値で指定すると上手くいくのですが、可変するようにしたいのでautoにして、結果無駄<br>をたくさん記述するはめになっています。

以前こちらで<div>の入れ子が上手くいかない時に clear: bothを入れると良いと聞いて入れ子構造は出来たのですが、今度は無駄<br>がないと入れ子にした際に（縦をautoにした場合）外側のdivが表示されないという状況です。

わかりづらい説明で申し訳ないのですが、何かが間違ってるせいだと思うのでわかる方宜しくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

No.1ベストアンサー

回答者： dezimac
回答日時：2007/06/19 15:55

http://allabout.co.jp/internet/hpcreate/subject/ …
↑サイトの記事
スタイルシート(CSS)で段組を構成する4(前編)　段の背景色が切れないようにする
あたりを参考に。

参考URL：http://allabout.co.jp/internet/hpcreate/subject/ …