JSFiddle - React, Tailwind, and code Playground

by Nevear

HTML

<div class="mob_mamon">
<label id="lab_mamon" for="in_mamon"> ``````</label>
<input type="checkbox" id="in_mamon">
<div id="expand">
    
      <p>mew</p>
    
  </div>
</div>

CSS

input[type=checkbox] + #expand {
  display: none;
  height: 0px;
}


input[type=checkbox]:checked + #expand {
  display: block;
  height: 110px;
  transition: all 1s ease-in-out;
}

#in_mamon[type=checkbox] {
  display: none;
  visibility: hidden;
}

#lab_mamon::before {
  font-family: Consolas, monaco, monospace;
  font-weight: bold;
  font-size: 15px;
  content: "";
  vertical-align: text-top;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 3px;
  background: url(https://mamon-beton.ru/templates/btn/images/icon.png) }