Trouble animating smooth list transition

[MatthewCaseres]

When my list items exit they all crunch together at the top of the list. https://codesandbox.io/s/0-intro-forked-k1lbt?file=/src/App.js

Anyone have ideas?

Edit: This example from the docs seems most relevant, with the menu display https://codesandbox.io/embed/lp80n9z7v9

[tomdohnal]

It gets crunched together because you apply position: absolute to the individual list items for the leave animation, rather than for the list (ul) itself.
I slightly refactored the code to achieve that functionality. Hope it helps :)
https://codesandbox.io/s/0-intro-forked-igrus?file=/src/App.js