JSFiddle - React, Tailwind, and code Playground
HTML
<div class="lightbox">
<div class="lightbox-content">
<div class="sample-content"></div>
</div>
<div id="close-lightbox">Close</div>
</div>
CSS
.lightbox{
position: fixed;
padding-bottom: 30px; /*for the close button*/
background: grey;
min-height:100%;
}
.lightbox-content {
overflow: auto;
height: 300px;
background-color: grey;
}
.sample-content {
height: 360px; /*higher than ligbox content to activate overflow*/
background-color: indianred;
}
#close-lightbox {
position: absolute;
bottom: 5px;
left: 30%;
}