JSFiddle - React, Tailwind, and code Playground

by kirito0709

HTML

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css">
<ul>
<li class="pr">Салат витаминный <i class="sostav cp far fa-question-circle"></i>
<div class="fs14 pa l15- r15-" style="color: #fff;background: #53301ed9;bottom: 138%;"><div class="lol pb5 pl10 pr10 pt5">Состав: Помидор, огурец, перец болгарский, лук репчатый, сфр фета, маслины, масло, соль</div></div>
</li>
<li class="pr">Салат витаминный <i class="sostav cp far fa-question-circle"></i>
<div class="fs14 pa l15- r15-" style="color: #fff;background: #53301ed9;bottom: 138%;"><div class="lol pb5 pl10 pr10 pt5">Состав: Помидор, огурец, перец болгарский, лук репчатый, сфр фета, маслины, масло, соль</div></div>
</li>
</ul>

CSS

.sostav + div{
  display: none;
}
.sostav:hover + div{
  display: block;
}