css - 在CSS中排列和定位两个div

Question

我是 CSS 新手，所以这个问题可能非常简单。我正在布置一个网站，但遇到了定位问题。

在网站上，我有一个中间部分，其中有一个标题，下面有一些可滚动的内容。这是标题 div 的相关 CSS:

#header {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    height: auto;
}

现在，我只想让内容 div 紧随其后，但不知道该怎么做。

position: relative; 
top: 0; 

似乎不起作用(我最初预计会起作用)。两个 div 都在同一逻辑层级，并包裹在中间部分 div 中。我可能遗漏了一些非常明显和简单的东西。

Answer 1

如果你有类似的东西

<header>header</header>
<main>main content</main>

使用这个 CSS:

header, main
{
    display: block; /* because <main/> is very new */
    padding: 20px;
    background: #eeeeee;
}

header
{
    background: blue;
}

就是这样，因为默认情况下， block 元素在彼此下方。

http://jsfiddle.net/86wX4/