I have a pop-up that only has a datagrid in it. Nothing else. I was experiencing a style issue (I think overflow or position) where the datagrid’s data/rows were overflowing onto the header (first screenshot) when user scrolls. I resolved this issue by placing the datagrid in a container (lucky guess). But while I was trying to double check the fix I removed it from the container but left the container on the page (second screenshot). It still worked (even when I removed the datagrid from the container). It was only when I removed the container from the bottom of the page that it went back to overflowing/broken. How is just the presence/existence of the container fixing this issue?
A way to find out would be to use chrome inspector to inspect the container and turn off the CSS properties on the container 1 by 1. When the datagrid collapses, you should know which CSS property is responsible for fixing the overflow.