JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<div class="container">
    <div class="a">A</div>
    <div class="b">B</div>
</div>

</body>

CSS

/* Only for testing */
.a, .b {
    border: 1px solid black;
}
/* Hide the B div */
.b {
    display:none;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.5s linear;
}
/* Show the B div when hover on A (the container include only A when B is not displayed */
.container:hover .b {
    display:block;
    visibility: visible;
    opacity: 1;
}