console
<body>
<div class="box">
<div class="content">
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</div>
<div class="wrapper">
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</body>
* {
margin: 0;
padding: 0;
}
.wrapper {
background: #fff;
}
p {
height: 150px;
}
p:nth-child(odd) {
background: gold;
}
.box {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgb(0, 0, 0, 0.6);
}
.content {
position: relative;
width: 300px;
height: 300px;
background: #fff;
overflow-y: auto;
}