Animar cambios de altura en div con contenido dinámico

Tengo una aplicación que obtiene contenido de una API y lo muestra en un contenedor flexible. Con un control deslizante puedo navegar a través de este contenido. El contenido que se muestra puede tener una altura diferente y quiero usar una animación suave de la altura de mi contenedor si mi contenido cambia. Debido a que el contenido que quiero mostrar es dinámico, no puedo usar una altura fija de mi contenedor y, en cambio, uso la altura al 100%. ¿Hay alguna forma de reaccionar ante los cambios de altura y aplicar la transición de, por ejemplo transistion: height 1s, también estoy abierto a algunas soluciones de JavaScript, pero no mencione ninguna jquery?

Tenga en cuenta que soy bastante nuevo en css y especialmente en animaciones/transiciones.

Solución del problema

Simplemente use una declaración de fotogramas clave como

@keyframes display {
 to {
 display: 100%;
 }
}

y luego decirle al elemento que ejecute la animación así

#yourElement {
 animation-name: display;
 animation-duration: 1s;
 animation-timing-function: linear;
}

Puede reemplazar el animation-timing-function: linearcon cualquier forma que desee que se vea la animación, consulte los documentos de Mozilla.