两个div和页面大小调整对齐

Question

我需要对齐页面上两个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：弯曲;父元素并切换与在CSS媒体查询的方向（行或列）。