CSS Grid
Last updated: March 31, 2022
Introduction
Intro outline
What can you do with grid?
You may have already been using this snippet … but now it’s time to learn all of the things – and how that snippet works.
- Grid: what is it? Why is it here?
- What is it good for?
- multidimensional
- break out of the document structure
- it’s smart…
- Examples of it
- Just setting grid… what happens by default?
- basic grid and 50% / and 1fr
- General terminology
- columns, rows, lines, tracks, cells,
https://css-irl.info/controlling-leftover-grid-items/
https://robleto.medium.com/jumping-into-css-grid-9912b48cd44e
https://yoksel.github.io/grid-cheatsheet/
https://v6.robweychert.com/blog/2018/11/css-grid-editorial-layouts/
https://brandonbrule.com/css-grid.html
OUR writeup —
https://docs.google.com/document/d/13vWoy50t2CwERA9HgKBObNsMv0sd0E6PQH29l90qFG4/edit