What's inside
1 Display Grid
The `display: grid` property enables grid-based layout, allowing precise placement of elements.
2 Grid Template Columns
The `grid-template-columns` property defines the number and width of columns in a grid.
3 Grid Template Rows
The `grid-template-rows` property sets the number and height of rows in a grid.
4 Grid Gap
The `gap` property defines spacing between grid items without using margins.
5 Grid Auto Flow
The `grid-auto-flow` property controls how elements are placed in the grid when not explicitly positioned.
6 Grid Column Start / End
The `grid-column-start` and `grid-column-end` properties define an element's horizontal placement.
7 Grid Row Start / End
The `grid-row-start` and `grid-row-end` properties determine an element’s vertical placement.
8 Grid Area
The `grid-area` property allows an element to span multiple grid rows and columns.
9 Justify Items
The `justify-items` property aligns grid items along the row axis.
10 Align Items
The `align-items` property aligns grid items along the column axis.
