JSFiddle - React, Tailwind, and code Playground

by moob

HTML

<div>
dfdfsdsdfsd<br/>
dfdfsdsdfsd<br/>dfdfsdsdfsd<br/>dfdfsdsdfsd<br/>
<select>
<option>ssfd</option>
<option>ssfd</option>
</select>
<p>
sfdfdfdfd
</p>
</div>
<div>
dfdfsdsdfsd
</div>

CSS

.s {
    transition-property: opacity, visibility;
    transition-duration: 250ms;
    transition-delay:    0, 250ms;
}
p {display:block; position:absolute;}
div {border:1px solid red; max-height:10px; overflow:hidden; 
transition: all 1s; 
position:relative;}
div:hover {max-height:120px; 
  overflow:hidden;
  animation: 2s delay-overflow;
}

body {
  overflow: auto;
}

@keyframes delay-overflow {
  to { overflow: visible; }
}