TL;DR
Dwuwymiarowa siatka CSS Grid zastąpiła tabele, floaty i sztuczki z position, a większość układu strony da się opisać kilkoma linijkami. Podstawą są display: grid, jednostka fr, gap i grid-template-areas, w których obszary strony rozpisujesz niemal jak tekst: nagłówek, menu, treść, panel boczny, stopka.
Kolejny poziom to repeat() z minmax() oraz auto-fit i auto-fill, dające responsywne karty bez media queries, a także subgrid do wyrównania zagnieżdżonych siatek. Wśród przykładów jest galeria z grid-auto-flow: dense i karty produktów, w których przyciski zawsze lądują na dole. Autorka przypomina też o dostępności: HTML ma mieć sens bez CSS, a Grid tylko zmienia wygląd.
Przez lata układaliśmy strony na tabelach, float i hackach z position. Dziś mamy CSS Grid, czyli natywny system siatki, który robi to samo w kilku linijkach kodu. Ten artykuł pokaz...
Czytaj cały wpis u źródła// tagi