JSFiddle - React, Tailwind, and code Playground

HTML

<div class="inset-box">
    some content that doesn't scroll
    <br/>
    inner shadow shouldn't be visible
</div>
<div class="inset-box">
    scrolling content
    <br/>
    scrolling content
    <br/>
    scrolling content
    <br/>
    scrolling content
    <br/>
    scrolling content
    <br/>
    scrolling content
    <br/>
    scrolling content
    <br/>
    scrolling content
    <br/>
</div>

CSS

.inset-box{
    height:100px;
    border:1px solid #aaa;
    overflow:auto;
    box-shadow:0 -10px 10px -10px #000000 inset;
}