JSFiddle - React, Tailwind, and code Playground

by fredrik

HTML

<div class="bar">
    <a href="#" class="btn">
        sometext
        <ul class="list">
            <li>sometext</li>
            <li>subtitle</li>
        </ul>
    </a>
</div>

CSS

.btn {
    position: relative;
    display: block-inline;
    
    padding: 4px;
}

.list {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
}

.list li {
    padding: 4px;
    background: #fff;
    border-bottom: 1px solid #ccc;
}

.btn:hover .list {
    display: block;
}