JSFiddle - React, Tailwind, and code Playground

by Fahd Murtaza

HTML

<div>
  <span>DINING</span>
</div>

CSS

span {
  padding-bottom: 20px; 
  line-height: 20px;
  display: block;
  width: 100px;
  text-align: left;

}


span:hover:after {
  display: block;
  position: relative;
  text-align: center;
  content: "\25BC";
  border-top: 2px solid green;
  padding: none;
    margin: none;
  color: green;
  width: 40%;
  text-decoration: none;

}