A very brief introduction to...

CSS Co�id CSS Grid

CSS GRid

  • A way creating two dimensional layouts using a grid.
  • For layout purposes, replaces tables, inline-block, floats.

Flexbox is great

...but it's made for laying out a single dimension.

Grid works in two dimensions

like, you know, a grid

Syntax

Grid Areas

Grid Areas

Compatibility

  • Supported by all* major browsers.
  • No polyfill.

* IE supports an older version of the spec, and needs -ms prefixes

Suomalainen.