JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    Наведи на меня
    <div class="menu">
    <ul>            
        <li>первый</li>
        <li>второй</li>
    </ul>
</div>
</div>

CSS

.box {
    width: 100%;
    padding: 15px 0px;
    box-sizing: border-box;
    text-align: center;
    color: #ffffff;
    background-color: #000000;
    position: releative;
}
.box:hover .menu {
    visibility:visible;
    opacity:1;
    transition-delay:0s;
}
.menu {
    background-color: #eeeeee;
    color: #000000;
    width: 100%;
    visibility: hidden;
    position: absolute;
    opacity: 0;
    transition: visibility 0s linear 0.5s,opacity 0.5s linear;
}
.menu > ul {
    padding: 10px;
    margin:0;
}
.menu > ul > li {
    list-style: none;
}