Tracks: rows and columns
Lines: between tracks
Gutters: gaps between tracks, like thick lines. Places at the end of a gutter.
Explicit grid: defined by grid-template-rows and grid-template-columns
Implicit grid: auto created tracks for items that don't fit in explicit grid
Explicit grid lines can be referenced. Implicit cannot
Fractional units define tracks as ratios
repeat() to define multiple tracks
items will be placed along lines and may overflow
min-content: length of the largest minimal content in the track, not the element width. e.g. longest word 4444
max-content: length of the largest maximal content in the track. e.g sentence rather than word
minmax: specify track dimension range
auto: as min value, takes up the largest minimum size or content
auto: as max value, max-content, won't overflow
auto: as a column takes up remaining space. think: minmax(min-content, max-content)
auto-fill and auto-fit are responsive grids. alternative is fixed tracks and media queries to layout grid areas.
auto-fill: inserts new columns
auto-fit: inserts new columns, collapses empty ones, and distributes space. fit space into existing tracks
auto-fit, auto-fill column tracks are explicit grid and can be referenced, but row tracks are still implicit
grid-auto-flow: defaults filling rows, can fill columns first
grid-auto-flow: `dense` fills gaps for items that don't have semantic ordering.
align-items: block axis grid item placement for all items in grid container
align-self: block axis grid item placement
justify-items: inline axis grid item placement for all items in grid container
justify-self: inline axis grid item placement
align-content: block axis tracks placement
justify-content: line axis tracks placement