Use virtual scroll list in the middle of a scrollable <div>

I am trying to use a virtual scroll list in the middle of scrollable <div> element. Unfortunately, the list is always placed at absolute coordinates instead of flowing naturally with the rest.

Here is a minimal working example: https://stackblitz.com/edit/solidjs-templates-nexbnn?file=src%2FApp.tsx

The code uses SolidJS, but that should probably not matter.