Understanding CSS subgrid

CSS Subgrid is now supported across all major browsers (Chrome, Edge, Safari, Firefox) as of late 2023. It solves a key limitation of CSS Grid: nested elements that aren't direct children of the grid container can't participate in the parent grid's layout. Subgrid lets child elements inherit the parent grid's column and row track definitions using the `subgrid` value on `grid-template-columns` or `grid-template-rows`. A practical example shows how to lay out a list of articles where each article's title, date, and body text align consistently across rows, without resorting to `display:contents` (which has accessibility issues) or duplicating grid definitions on each item.