Как я могу перейти на высоту: 0; по высоте: авто; используя CSS? ⇐ CSS

[Гость]

Я пытаюсь сдвинуть вниз с помощью переходов CSS.

начинается с height: 0;. При наведении высота устанавливается на height:auto;. Однако из-за этого он просто появляется, а а не переходит

Если я сделаю это от height: 40px; до height: auto;, то оно сдвинется вверх до height: 0;, а затем внезапно подпрыгнуть на нужную высоту.

Как еще я могу сделать это без использования JavaScript?

#child0 { высота: 0; переполнение: скрыто; цвет фона: #dedede; -moz-transition: высота легкости 1с; -webkit-transition: легкость высоты 1 с; -o-переход: высота 1с легкость; переход: высота 1с легкость; } #parent0:hover #child0 { высота: авто; } #ребенок40 { высота: 40 пикселей; переполнение: скрыто; цвет фона: #dedede; -moz-transition: высота легкости 1с; -webkit-transition: легкость высоты 1 с; -o-переход: высота 1с легкость; переход: высота 1с легкость; } #parent40:hover #child40 { высота: авто; } ч1 { начертание шрифта: жирный; Единственная разница между двумя фрагментами CSS заключается в том, что один имеет высоту: 0, другой — высоту: 40. Наведите на меня курсор (высота: 0) Некоторый контент
Некоторый контент
Некоторый контент
Некоторый контент
Некоторый контент
Некоторый контент
Наведите на меня (высота: 40) Некоторый контент
Некоторый контент
Некоторый контент
Некоторый контент
Некоторый контент
Некоторый контент