~/talk

CSS Grid Layout

on YouTube 50m
Talkat CSS Day 2015 · on Friday, 2015-06-12· [css, web-platform]

speaker

name:Rachel Andrew
website:https://rachelandrew.co.uk

resources

video:https://youtu.be/PzJQOjsSQIQ
slides:https://noti.st/rachelandrew/vXGvXa/unlocking-the-power-of-css-grid-layout

summary

Live demos and code show how the CSS Grid Layout module declares grids with grid-template, the repeat() keyword and the fr unit to allocate space, uses line and area placement to reposition content without changing markup, and employs grid-auto-flow: dense to backfill gaps. Notes call out the missing convenient gutter properties and an at-risk subgrid feature. Examples live on Grid by Example and slides; Chrome support sits behind a flag.

AI-written summary · about

chapters (5)

  1. 0:00Start
  2. 3:23We need a designed for purpose layout system for the sites and applications we develop today.
  3. 8:30Line-based placement
  4. 20:32A 12 column, flexible grid
  5. 35:09The Gutter Problem

related talks

~/search
type to search 6,249 conferences, 138,987 speakers and 185,172 talks
~/help
cmdctrl k
search every conference, speaker and series
/
focus the filter search
h
home
c
conferences
s
speakers
e
series
t
light / dark — the status bar button does the same
?
this help
esc
close this, then clear every filter — or just the search, while you are typing in it

Ignored while you are typing. Pages without a filter rail have no search to focus.