html - css height 残り全部 - divの高さをブラウザウィンドウの100%にする方法

CSS height / html / css / height

左の div と右の div の2つの列を持つレイアウトがあります。

右側の divbackground-color は灰色で、ユーザーのブラウザウィンドウの高さに応じて垂直方向に拡大する必要があります。現在、 background-color はその div の最後のコンテンツで終わります。

Peter Mortensen



Answer #1
.left {
  height: 100vh;
  width: 50%;
  background-color: grey;
  float: left;
}

.right {
  height: 100vh;
  width: 50%;
  background-color: red;
  float: right;
}
<div class="left"></div>
<div class="right"></div>