仕事と子供3人の子育てをしながら、短時間でできる料理とつくばの身近な情報・お役立ち情報を発信します
2011-01-13 (木) | 編集 |
今日はまったこと(覚え)。



一番下までスクロールすると、bodyに指定してある左のバーが10ピクセルくらい上できれてしまっています。
特にマージンなどもつけていないのに、なぜこの余白ができるのかわかりません。


構造は
<html>
<head>
<link rel="stylesheet" href="css/screen.css" type="text/css" media="screen,print" />
<title>test</title>
</head>
<body>
<div id="header">
ヘッダー
</div>
<div id="contentsContainer" class="clearfix">
<div id="mainColumn">
メインカラム
</div>
<div id="sideColumn">
サイドカラム
</div>
</div>
</body>
</html>

#mainColumn に
height: 1000px;
などを指定して、スクロールが必要な状態にしておきます。

#contentsContainerにoverflow:hidden;を設定すると、下まで伸びてきちんと表示できました。
でも、なぜここでoverflow: hidden;が必要なのか、いまいちわからない。。。
関連記事

ブログランキング・にほんブログ村へ
プラチナレポーター
コメント:
この記事へのコメント:
コメント:を投稿する
URL:
コメント:
パスワード:
非公開コメント: 管理者にだけ表示を許可する