CSS Grid

display: grid creates a grid container. You define columns and rows, and children fill the cells in order:

.gallery { display: grid; grid-template-columns: 200px 200px 200px; gap: 16px; }

Grid is two-dimensional — it controls rows and columns at the same time, so it suits whole-page layouts and galleries. Flexbox is one-dimensional; use each where it fits, and nest them freely.