JSFiddle - React, Tailwind, and code Playground

HTML

<div style="height: 200px;">
    <div class="tran">
        Example
    </div>
</div>

CSS

.tran{
    -webkit-transition: height 0.5s ease-in-out;
    -moz-transition: height 0.5s ease-in-out;
    -o-transition: height 0.5s ease-in-out;
    transition: height 0.5s ease-in-out;
    height: 100px;
    background: #e5e5e5;
    height: 100%;
}

.tran:hover{
    height: 75%;
}