Ask HN: Using CSS grid for entire page

I've been learning CSS grid, and wanted to have the entire page based it. The goal was to be responsive automatically.

When all the children "grid-area" is set to auto, is all good. But if a few of them have custom "grid-area", things start to get weird.

Since the content is dynamic (element being added or deleted randomly), I couldn't add a media query then custom the "grid-area" as it needed to be

Appreciate any solution.

(somewhat similar to this https://material.io/design/layout/responsive-layout-grid.html#breakpoints)