JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content">
    <div>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>some line go here
        <br>
    </div>
    <div class="floating">floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>floating
        <br>
    </div>
</div>
</div>

CSS

* {
    border: 1px solid blue;
    background: rgba(0, 0, 0, 0.1);
}


.floating {
    position: fixed;
    top: 50px;
    right: 7px;
    overflow: scroll;
    height: 100px;
}


.content {
    position: fixed;
    width: 100%;
    top: 47px;
    bottom: 44px;
    left: 0;
    margin: 0;
    overflow: scroll;
}