JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="tooltip">
    <li>
        <a href="#">tooltipsample1</a>
      <div>sample</div>
    </li>
    <li>
        <a href="#">tooltipsample2</a>
      <div>sample</div>
    </li>
    <li>
        <a href="#">tooltipsample3</a>
      <div>sample</div>
    </li>
</ul>

CSS

#tooltip{
    margin:70px 0  0  30px;
}
#tooltip li{
    width:150px;
    height:50px;
    display:block;
    float:left; 
    position:relative;      
}
#tooltip li > div {
    width: 150px;
    min-height: 20px;
    position: absolute;
    top:-50px;
    margin-left: -25px;
    padding: 5px;
    visibility:hidden;
    opacity: 0;
    background: #ffffff;
    font-size:1em;

/* Setting the border-radius property for all Browsers */
    -moz-border-radius: 5px; /* Firefox */
    -webkit-border-radius: 5px; /* Safari and Chrome */
    border-radius: 5px; /* Browsers that Support it like Opera */

/* Setting the box-shadow property for all Browsers */
    -moz-box-shadow: 0 0 8px gray; /* Firefox */
    -webkit-box-shadow: 0 0 8px gray; /* Safari and Chrome */
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#272229', Direction=135, Strength=3); /* IE */
    box-shadow: 0 0 8px gray; /* Browsers that Support it like Opera */
/* Setting the transition property for all Browsers */
    -moz-transition: all 0.5s ease-in-out; /* Firefox */
    -webkit-transition: all 0.5s ease-in-out; /* Safari and Chrome */
    -o-transition: all 0.5s ease-in-out; /* Opera */
    transition: all 0.5s ease-in-out; /* Browsers that Support it */         
    }
#tooltip li > div:after {
    content:"\25B8"; 
    display:block;
    font-size:2em;
    height:0;
    line-height:0;
    position:absolute;
    color:#fff;
    bottom:-3px;
    left:1px;
    text-align:center;
/*     -moz-transform:rotate(90deg);
    -webkit-transform:rotate(90deg); */
    width:100%;
    text-shadow: 3px 0 2px #ccc;
}
#tooltip li:hover > div {
    visibility:visible;
    opacity: 1;
    top:-50px;
/* Setting the transition property for all Browsers */
    -moz-transition: all 0.5s ease-in-out; /* Firefox */
    -webkit-transition: all 0.5s ease-in-out; /* Safari and Chrome */
    -o-transition: all 0.5s ease-in-out;  /* Opera */
    transition: all 0.5s ease-in-out; /* Browsers that Support it */
}