JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="two">
        <div id="three">three, please hover me</div>
        <div id="one">one</div>
    </div>
</div>

CSS

#container {
    background-color:#ccc;
    position:relative;
}

#one {
    display:none;
    background-color:green;
    position:absolute;
    top:100%;
}

#two {
    overflow:hidden;
}

#three {
    float:right;
    display:inline-block;
    border:1px solid;
}

#two:hover #one {
    display:inline-block;
}