html div垂直分布,html – css div之间的垂直差距

我知道这是一个常见的问题,但似乎找不到有效的解决方案.我有一个这样的设置：

Title

some other text

.content-area-top {

height: 12px;

width: 581px;

background-image: url(images/content-top.jpg);

}

.content-area {

margin-left: 10px;

margin-right: 10px;

background-color: #e9ecfd;

}

问题在于.content-area-top和.content-area之间有差距. .content-area-top div的大小可以包含一个背景图片,给我所需的圆角.

我知道这个问题的原因是H1标签有一个(浏览器默认)顶部边距设置(.67em),但是我不愿意将其边距设置为0,我不明白为什么它的边距适用于外部’它包含div.

我在Mac上使用chrome,但是firefox有同样的问题.这可能是一些众所周知的修复,但是我找不到一个我案例的具体解决方案.