javascript - 如何让我的 Div2 直接位于我的 Div1 下方

Question

这是我的代码。我希望它不是硬编码尺寸，以便它可以在不同的浏览器分辨率下工作(不确定这是否是正确的术语)提前非常感谢。

#div1 {
  position: absolute;
  background-color: cyan;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 24px;
  text-align: center;
  width: 300px;
  border: 25px solid red;
  padding: 25px;
  top: 30%;
  left: 50%;
  margin: -100px 0 0 -150px;
}
#div2 {
  background-color: cyan;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 24px;
  text-align: center;
  width: 300px;
  border: 25px solid orange;
  padding: 25px;
}

<div id="div1">Greeting Card Generator</div>
<div id="div2">Content Goes Here</div>

Answer 1

你只需要删除 #div1 的一些属性，#div1 的 CSS 将是，

#div1 {
  background-color: cyan;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 24px;
  text-align: center;
  width: 300px;
  border: 25px solid red;
  padding: 25px;
}

Check this fiddle here