CSS Div排列和对齐问题[重复]

Question

我是 css 初学者，我遇到了 div 排列的问题。

我想在屏幕顶部放置一个 div，150px 100% 宽度。 以及正下方的另一个 div，它将占据屏幕的提醒部分。

如果我添加第二个 div“高度：100%”，它会超过屏幕尺寸并让我滚动，我不希望这样。只是它将占用空闲屏幕区域，并调整为窗口大小。

谢谢！！

Answer 1

#top{
background-color:blue;
height:150px;

}
#bottom{
background-color:green;
height:calc(100vh - 150px - 16px) ;
}

<div id='top'></div>
<div id='bottom'></div>