javascript - Transition to shrink / expand to auto height element

Question

Closed. This question needs details or clarity. It is not currently accepting answers. question from:https://stackoverflow.com/questions/65938201/transition-to-shrink-expand-to-auto-height-element

Answer 1

You couldn't animate height but you could do that using max-height :

.shrink-enter-active,
.shrink-leave-active {
    transition: all 0.5s ease-out;
    max-height: 400px;
}

.shrink-enter,
.shrink-leave-to {
    max-height: 0;
}

this is inspired by my sidebar component here and the code is here