これは一般的な問題のようですが、私が見つけた解決策はどれもうまくいきませんでした。
HTML
<html>
<head>
<link rel="stylesheet" href="c/lasrs.css" type="text/css" />
</head>
<body>
<div class="header">
<img src="i/header1.png">
</div>
<div class="content">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus.
Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis,
massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et,
bibendum at, posuere sit amet, nibh.</p>
</div>
</body>
</html>
CSS
body {
min-width: 950px;
background-color: #FFFFFF;
color: #333333;
}
.header {
width: 950px;
height: 171px;
margin: 0px auto;
padding: 0px;
background-color: #CCCCCC;
position: relative;
}
.content {
width: 950px;
margin: 0px auto;
padding: 0px;
background-color: #E3EEF9;
position: relative;
}
意図的に画像パスを壊し、.header
div の背景色を設定して、それらが接触しているかどうかを確認できるようにしました。これは私のページがどのように見えるかです:
ご覧のとおり、両方のパディングとマージンdivs
を 0 に設定してみました。
なぜまだギャップがあるのですか?