JSFiddle - React, Tailwind, and code Playground

by damiantt

HTML

<div class="pinkBox">
  <div class="tooltipRight">
  </div>
</div>

CSS

.pinkBox {
  width: 100px;
  height: 100px;
  background: pink;
  position: relative;
}

.tooltipRight {
    position: absolute;
    width: 280px;
    height: 200px;
    background: orange;
    top: 50%;
    left: 100%;
    visibility: hidden;
    transition: visibility 500ms;
}

.pinkBox:hover .tooltipRight {
    visibility: visible;
    transition-delay: 100ms;
}