html - 使遮光 div 拉伸(stretch)到其顶部 div 高度的 100%

Question

我有一个“blackout”div(一个以 50% 不透明度用黑色填充整个屏幕的 div)以帮助为位于其顶部的弹出式 div 创建焦点。

我目前将 blackout div 设置为 height: auto 并将 min-height 设置为 100 VH。它有 position: absolute。弹出 div 的高度为 600 像素。问题是，如果浏览器窗口的高度小于弹出 div 的高度，blackout div 只会延伸到浏览器窗口的高度，而不是弹出 div。

正常:

小浏览器窗口高度，向下滚动:

Answer 1

不确定 height:auto; 在这种情况下是否有效。

尝试:

.blackout {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}