gpt4 book ai didi

html - 用 flexbox 和 overflow 覆盖

转载 作者:行者123 更新时间:2023-12-05 04:19:54 25 4
gpt4 key购买 nike

<分区>

在结帐页面上,我在网站顶部制作了一个叠加层,其中 body 上的滚动被禁用,但在叠加层上启用了溢出。

但如果视口(viewport)较小,叠加层上的内容将被剪裁。

如何避免这种情况?

我尝试将 overflow:auto 添加到叠加层,但没有成功:

body {
overflow: hidden;
}

#overlay.active {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
overflow: auto;
background: yellow;
}
<div id="overlay" class="active">
<div style="height:300px; background:white; padding:20px">
content
</div>
</div>

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com