JSFiddle - React, Tailwind, and code Playground

HTML

<div id="outer">
    <div id="innerA">
        <div id="innerB">
            This<br/>is<br/>a<br/>multiline<br/>testcase.<br/>
            This<br/>is<br/>a<br/>multiline<br/>testcase.<br/>
        </div>
    </div>
</div>

CSS

#outer {
    width: 500px;
    height: 300px;
    background: yellow;
    overflow: auto;
}

#innerA {
    width: 100%;
    height: 100%;    
    background: green;
    float: left;
}

#innerB {
    margin-top: 10px;
    background: blue;
}