Frontend
What is CSS Grid?
A two-dimensional CSS layout system for placing elements in rows and columns with precise, media-query-light control.
Definition
CSS Grid Layout (display: grid) is the browser-native way to control both rows and columns simultaneously, unlike Flexbox's single axis. Key primitives include grid-template-columns with the fr unit, repeat() with auto-fill/auto-fit for responsive tracks without media queries, minmax() for fluid sizing, and named grid areas for readable page scaffolding. Subgrid, now supported in all evergreen browsers, lets nested elements align to an ancestor's tracks—solving card-alignment problems that previously required JavaScript. Grid handles page-level layout; Flexbox remains better for one-dimensional content flows like toolbars.