CSS Dojo道場 · practice
All tracks

Track

Box Alignment

justify-content, align-items, align-self, align-content, justify-items, justify-self — and the place-* shorthands that position items inside flex and grid containers.

  1. 01Spacing along the main axis★★★
  2. 02Lining up the cross axis★★★
  3. 03One item breaks rank★★★
  4. 04Spacing the wrapped lines★★★
  5. 05Centring inside grid cells★★★
  6. 06One cell, its own rules★★★
  7. 07The place-content shorthand★★★
  8. 08The place-items shorthand★★★
  9. 09The classic flex centring★★★
  10. 10Boss: the full spread★★★