JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="m" class="menu">
   <li>
          <a href="#">
               <strong>Home</strong>
           </a>
  </li>

   <li>
          <a href="#">
               <strong>Home</strong>
           </a>
  </li>
</ul>

CSS

#m > li > a{
    text-decoration: none;
}
#m > li a:hover strong {color:#fff !important;}
#m li a:active strong{color:#00f !important; border-bottom: #823428 2px solid !important;;}