JSFiddle - React, Tailwind, and code Playground

by Kondal Durgam

HTML

<table>
<tr><td>
    <a href="#">Info
        <div class="tooltipcontainer">
            <div class="tooltip">Here some info</div>
        </div>
    </a>
</td></tr>
</table>

CSS

/* Container is necessary because td cannot be positioned relative */
  td .tooltipcontainer {
      position: relative;
  }
  td .tooltip {
      display: none;
      position: absolute;
      /* More positioning, heigh, width, etc */
  }
  td a:hover .tooltip {
      display: block;
      background: green;
      padding:15px;
      color:#fff;
  }