JSFiddle - React, Tailwind, and code Playground

by abdulmalik

HTML

<ul id="menu">
    <li><a href="#.">Test1</a></li>
    <li><a href="#.">Test2</a></li>
</ul>

CSS

#menu li {float:left;}
#menu li a{
    color:#595959;
    font-size:14px;
    font-weight:bold;
    position: relative; 
    overflow:hidden;
    padding:2px 5px;
    display:block;
}

#menu li a:hover{
    color:#FFFFFF;  
    font-weight:normal;
    background-color:#e11d3b;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px; 
    text-decoration:none; 
    padding:2px 5px 2px 6px;
    
}