JSFiddle - React, Tailwind, and code Playground

HTML

<div class="submenu">
    <ul>
        <li><a href="#">Item 1</a></li>
        <li><a href="#">Item 2</a></li>
        <li><a href="#">Item 3</a></li>
    </ul>
</div>

CSS

.submenu {
    background: red;
    text-align: center;
}

.submenu > ul {
    display: inline-block;
    background: #eee;
    border-radius: 9px;
    padding: 0 10px;
}
.submenu > ul > li {
    display: inline-block;
}
.submenu > ul > li > a {
    display: block;
    padding: 7px 10px;
}