JSFiddle - React, Tailwind, and code Playground

by painotpi

HTML

<div>
    <div id="test"></div>
</div>

CSS

div {
    width: 100%;
    height: 20px;
}
#test {
    width: 100%;
    background: orange;
    position: relative;
}

#test:hover::after {
    content:"Tooltip";
    background-color:blue;
    color: white;
    font-weight:bold;
    top: 100%;
    position: absolute;
    left: 40%;
    padding: 2%;
}