使用自定义提醒时无法向下滚动

Question

我使用CSS创建了自定义模式：

.backdrop{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
    z-index: 50;
}

.modal-box{
    position: fixed;
    top: 5vh;
    left: 30vw;
    width: 40vw;
    padding: 16px;
    z-index: 100;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.26);
    text-align: center;
    border-radius: 15px;
}

当模态过高时，我无法访问模型的底部。 我缺少哪个财产？

Answer 1

我认为position: fixed已在屏幕上固定。
因此，如果要滚动，则必须更改fixed-> absolute。

Answer 2

您模态的高度大于视口。

添加底部属性以防止其高度下降，并添加溢出属性，以便您可以在模式中滚动。

bottom: 5vh;
overflow: auto;