JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <div id="div1">
        div 1
    </div>
    <div id="div2">
        div 2
        <div id="msgErreur">
            <div>Error</div>
        </div>
    </div>
</div>

CSS

#div1 { 
    width : 48%;
    border: 1px solid red;
    height: 150px;
    float:left;
}
#div2 { 
    width : 48%;
    border: 1px solid blue;
    height: 150px;
    float:right;
    overflow-y:scroll;
    background-color: yellow;
}

#msgErreur {
    color:white;
    position:absolute;
    z-index:5;
}
#msgErreur > div {
    background:#942911;
    position: relative;
    top:30px;
    left: -10px;
    width : 150px;
    height : 30px;
}