Home›Module 06 — CSS Grid
Module 06

CSS Grid

2D layouts — arrange elements in both rows and columns simultaneously.

📚 5 Lessons
🎯 Intermediate
⏱ ~3 hours
Prerequisite Complete Module 05 — Flexbox first.

📋 What You Will Learn

  • What CSS Grid is and how it differs from Flexbox
  • Grid container: grid-template-columns, grid-template-rows, gap
  • Grid item placement: grid-column, grid-row, span
  • Grid template areas — named layout regions
  • Real-world Grid layouts

📖 Lessons

  1. 1CSS Grid IntroductionReady
  2. 2Grid Container PropertiesReady
  3. 3Grid Item PropertiesReady
  4. 4Grid Template AreasReady
  5. 5Grid Practice LayoutsReady
← Module 05 Module 07 →