JSFiddle - React, Tailwind, and code Playground

HTML

Without tooltip:
<div>
(<span class="tt">Hoverable text in here</span>)
</div>

With tooltip:
<div>
(<span class="tt">Hoverable text in here<span class="ttt">random tooltip in here</span></span>)
</div>

CSS

.tt {
	position: relative;
  color: red;
}

.ttt {
	visibility: hidden;
	width: 50px;
  position: absolute;
	margin-left: 25px;
}

.tt:hover .ttt {
	visibility: visible;
}

div {
  width: 150px;
}