JSFiddle - React, Tailwind, and code Playground

by cmruser

HTML

<br><br><br><br>
<span data-title="this is test asdf  asdf saf as adf asdser adfff asdfw adfffasdf aasdf safwra">test</span>

CSS

[data-title] {
  position: relative;
}

[data-title]:hover:after {
  
  content: attr(data-title);
  
  display: block;
  padding: .5rem;
  border-radius: 5px;
  background: #eee;
  width: 200px;
 
  
  position: absolute;
  bottom: 100%;
  left: 100%;
}