JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="text">
        Extend this to see undesired effect!
    </div>
    <div class="extendable">
    </div>
</div>

SCSS

html {
    font-size: 12px;
}

.container {
    float: right;
    min-width: 10em;
    padding-left: 1em;
    border: 1px solid black;
    .text {
        padding: 0.3em;
        border: 1px solid red;
    }
    .extendable {
        border: 1px solid blue;
        width: 200px; //static sample
        height: 200px; //static sample
    }
}