JSFiddle - React, Tailwind, and code Playground

HTML

<div id = "text">text</div>
<div id = "alert">alert<br><small>scroll down and cover disapears</small></div>

CSS

html,body{
        position:relative;
    }

#text{
    height:1000px;
}
#alert{
    position:absolute;
    top:0%;
    bottom:0%;
    left:0%;
    right:0%;
    background-color:rgba(187,201,247,0.5);
    z-index:3;
    text-align:center;
    font-size:20px;
}