JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li><a href="">Some Link</a></li>
    <li><a href="">Some Link</a></li>
    <li><a href="">Some Link</a></li>
</ul>

CSS

li {
    list-style-type: none;
    float: left;
    margin: 1px;
    position: relative;
}

a {
    text-decoration: none;
    font: 20px solid arial, sans-serif;
    color: white;
    display: block;
    width: 120px;
    height: 40px;
    background: green;
    text-align: center;
    line-height: 40px;
}

a:hover {
    height: 50px;
    line-height: 50px;
    position: absolute;
    top: -5px;
}