html - 相对放置div后的内容

Question

如果我相对显示一个 div 并给它一个上边距，我是否必须给下面的所有内容同样的上边距？因为后面的内容会在元素的常规位置之后。

http://jsfiddle.net/u9cgu6er/

正如您在这里看到的，blue div 位于 red 之上，紧跟在蓝色的原始位置之后。

有没有一种方法可以使 red 降低 20px 而不使其成为 relative？换句话说，不要对以下所有内容都这样做。

#a {
  width:100%;
  background-color:yellow;
  height:50px;
}
#b {
  position:relative;
  top:20px;
  width:50%;
  background-color:blue;
  height:50px;
}
#c {
  width:100%;
  background-color:red;
  height:50px;
}

<div id="a"></div>
<div id="b"></div>
<div id="c"></div>

Answer 1

将 margin-top: 20px; 添加到您的 #c。 @HashemQolami 是对的，如果可以的话，通过在 #b 上使用 margin-top 而不是位置 relative 来维护你的 css 会更容易。