两个DIVS的对齐和页面大小调整

Question

我需要在页面上对齐两个div，以便在调整其大小时，主div向上，另一个div向下（Twitter布局就是一个很好的例子。）

#corpoForm {
  min-width: 30%;
  padding: 2%;
  padding-top: 7.5%;
  float: right;
  font-family: Arial;
  font-size: 14pt;
  background-color: rgb(22, 22, 22);
  margin-left: 0px;
  height: 100%;
  color: rgb(255, 109, 13);
}

#vermelha {
  float: left;
  height: 100vh;
  width: 70%;
  background-color: red;
  margin-right: 0px;
}

#tudo {
  display: table;
  background-color: darkmagenta;
  width: 100%;
  height: 100vh;
}

<div id="tudo">
  <div id="corpoForm"></div>
  <div id="vermelha"></div>
</div>

Answer 1

您可以使用display：flex;在父元素上，并使用CSS中的媒体查询切换方向（行或列）。