JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="hovertab">
    <li>
        <div class="wrap">
            some text
            <div class="img"></div>
            <div class="hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis, enim at lacinia posuere, lacus nibh tristique enim, quis scelerisque dui sapien nec augue.</div>
            more text 
        </div>
    </li>
    <li>
        <div class="wrap">
            some text
            <div class="img"></div>
            <div class="hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis, enim at lacinia posuere, lacus nibh tristique enim, quis scelerisque dui sapien nec augue.</div>
            more text 
        </div>
    </li>
    <li>
        <div class="wrap">
            some text
            <div class="img"></div>
            <div class="hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis, enim at lacinia posuere, lacus nibh tristique enim, quis scelerisque dui sapien nec augue.</div>
            more text 
        </div>
    </li>
    <li>
        <div class="wrap">
            some text
            <div class="img"></div>
            <div class="hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis, enim at lacinia posuere, lacus nibh tristique enim, quis scelerisque dui sapien nec augue.</div>
            more text 
        </div>
    </li>
    <li>
        <div class="wrap">
            some text
            <div class="img"></div>
            <div class="hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis, enim at lacinia posuere, lacus nibh tristique enim, quis scelerisque dui sapien nec augue.</div>
            more text 
        </div>
    </li>
    <li>
        <div class="wrap">
            some text
            <div class="img"></div>
            <div class="hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis, enim at lacinia posuere, lacus nibh tristique enim, quis scelerisque dui...

CSS

body{font: normal 11px Arial, sans-serif;}
li{
    float:left;
    width:100px;
    height:100px;
    margin:10px 10px 20px;
    position:relative;
    text-align:center;
}
.img{
    height:60px;
    margin:10px;
    background:green;
    border:solid 1px silver;
}
li .wrap{background:white;}
.hidden{display:none;}
li:hover .wrap{
    position:absolute;
    top:-1px;
    left:-1px;
    border:solid 1px silver;
    border-radius:5px;
    z-index:100;
    box-shadow:0 0 10px #a0a0a0;
}
li:hover .wrap .hidden{display:block;}