JSFiddle - React, Tailwind, and code Playground

by Lucas Krause

HTML

<div class=a>
    <div class=b>
        <div class=c></div>
        <p>hello</p><p>world.</p>
        <p>hello</p><p>world.</p>
        <p>hello</p><p>world.</p>
    </div>
</div>

CSS

.a {
    background:#eee;
    width:300px;
    height:300px;
    overflow:auto;
}
.b {
    overflow:visible;
    height:100%;
    background:tomato;
}
.c {
    height:100%;
    background:royalblue;
    opacity:.8;
    background-clip:content-box;
    padding:5px;
    border:solid royalblue 5px;
    box-sizing:border-box;
}