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;が必要なのか、いまいちわからない。。。
一番下までスクロールすると、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;が必要なのか、いまいちわからない。。。
Posted by スポンジボブ at 00:40│Comments(0)│html
※このブログではブログの持ち主が承認した後、コメントが反映される設定です。
コメントフォーム
