JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="first">
        Here comes the first content
        <div id="second">I will render below the first content</div>
    </div>
</div>

CSS

#wrapper {
    background: #f1f1f1;
    height: 500px;
    margin: 50px auto;
    overflow: hidden;
    padding: 10px 10px 30px 10px;
    width: 250px; 
}

#first {
    background: rgba(255, 0, 0, .2);
    height: 100%;
    overflow: hidden;
    padding: 10px;
}

#second {
    background: rgba(0, 255, 0, .2);
    margin: 0 -10px;
    height: 100%;
    padding: 10px;
}