How Duolingo Plans to Reach 100M Users

Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Independent

Learn CSS Grid

via Independent

Go to class Write review
Simplilearn Ad

Pass the PMP® Exam on Your First Try — Expert-Led Training

Learn More → Scrimba Ad

Free courses from frontend to fullstack and AI

Learn More →

Overview

Google, IBM & Meta Certificates — All 10,000+ Courses at 40% Off
One annual plan covers every course and certificate on Coursera. 40% off for a limited time.
Get Full Access
Explore the powerful CSS Grid layout system through this comprehensive tutorial. Master essential concepts including grid containers, explicit and implicit grids, track sizing, and item positioning. Learn to create flexible layouts using techniques like repeating tracks, naming grid lines and areas, and spanning items across rows and columns. Dive into advanced topics such as layering grid items, aligning grid tracks, and implementing box alignment for precise control over your designs. Gain practical skills to build responsive and complex layouts with ease using CSS Grid.

Syllabus

  1. Grid Container
  2. Explicit Grid
  3. Minimum and Maxmum Grid Track Sizes
  4. Repeating Grid Tracks
  5. Grid Gaps (Gutters)
  6. Positioning Items by Grid Line Numbers
  7. Spanning Items Across Rows and Columns
  8. Naming Grid Lines
  9. Positioning Items by Line Names
  10. Naming and Positioning Items by Lines with the Same Name
  11. Naming and Positioning Items by Grid Areas
  12. Implicit Grid
  13. Implicitly Named Grid Areas
  14. Implicitly Named Grid Lines
  15. Layering Grid Items
  16. Aligning Grid Items (Box Alignment)
  17. Aligning Grid Tracks

Taught by

Jonathan Suh

Reviews

Start your review of Learn CSS Grid

Go to class

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.