CSS Dojo道場 · practice
All tracks

Track

CSS Containment

The `contain` property, `content-visibility`, and `contain-intrinsic-size` — how to tell the browser what an element's size and layout can safely ignore.

  1. 01contain: size ignores the children
  2. 02contain-intrinsic-size reserves the space
  3. 03contain: layout stops the escape
  4. 04contain: paint clips and anchors
  5. 05contain: strict is all three
  6. 06contain: content leaves size out
  7. 07content-visibility skips the contents
  8. 08Reserving space for skipped content
  9. 09Boss: the contained card