Как сделать плавный динамический выпадающий список?

Question

[zeni1agent]

Я хочу сделать плавный выпадающий список
Я сделал вот такой вариант

но проблема в том что мне постоянно нужно подбирать нужный max-height
Особенно это сложно если блоки разной высоты
Как я могу сделать плавный выпадающий список ?

Answer 1

[zeni1agent]

Возможно я нашел решение

ul:not(.menu) {
  overflow: hidden;
  max-height: 0;
  transition: 0.5s ease-out;
}

li:hover>ul {
  max-height:100vh;
  transition: 0.5s ease-in;
}

Answer 2

[MagnusDidNotBetray]

Можно так, например

Comments

[zeni1agent]

А почему есть только первый блок position ?
Мне нужно что бы это работало для всего списка целиком и не важно какая у него глубина или разница в размерах шрифта.