JSFiddle - React, Tailwind, and code Playground

by Gustavo Carvalho

HTML

<input type="checkbox" id="toggle-1">
<ul id='dropDown'>
    <li>Content</li>
    <li>Content</li>
    <li>Content</li>
    <li>Second to last one</li>
    <label for="toggle-1"><li>Last one</li></label>        
</ul>
<div>Other content</div>

CSS

ul {
    background:red;
    margin-top:-90px;
    transition: 1s;
}
ul li {
    transition: 1s;
}
input[type=checkbox] {
   position: absolute;
   top: -999px;
   left: -999px;
}
input[type=checkbox]:checked ~ ul {
    margin-top:0px;
}
label {
    display:block;
    width:100%;
    height:20px;
}