JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box">
  <ul>
    <li><h2>Item</h2></li>
    <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
      <li><h2><a href="">Item<span>Popup</span></a></h2></li>
      <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
      <li><h2>Item</h2></li>
  </ul>
</div>

CSS

#box {
   width: 10em;
   height: 10em;
   overflow:auto;
    
}

#box ul {
   line-height: 2em;
}

#box ul li a {
   position: relative;
}
#box ul li a span {
   display:none;
   
}
#box ul li a:hover span {
   display:block;
   height:200px;
   width:200px;
   position:fixed;
   top:11px0;
   left:100px;
   z-index:2;
   background:#ccc;
    
}