Почему не работает плавная анимация css?

Question

[m4son]

Мне нужно сделать кнопку, при нажатии на которую будет плавное увеличение высоты с фиксированной до auto. Но анимации нет, переход резкий. Не могу понять почему. Анимацию делаю через @keyframes

Comments

[Just Me]

тебе надо не @keyframes, а jquery slideDown или его аналог на vanilla JS

[Rustam Bainazarov]

Анимация height: auto; невозможна.

Answer 1

[Dima Polos]

До значения auto не будут transition и анимация работать. Нужно конкретно сказать, сколько пикселей высота будет.

Comments

[Kovalsky]

Или попробовать выкрутиться с помощью max-height

[Dima Polos]

Kovalsky, можно так, да, или сделать блоку высоту 100vh, анимировать, и задать overflow-y: auto