Learn CSS Grid

This tutorial teaches you CSS Grid through 14 interactive screencasts. You'll learn all the key concepts while building three awesome layouts: a website, an image grid, and an article. Plus, you'll learn how to combine CSS Grid with Flexbox.

• CSS Grid fundamentals
• Starting with grid
• Responsive grids
• Fraction units
• Repeat
• Positioning items
• Template areas
• Auto-fit
• minmax
• Implicit rows
• Named lines
• justify-items
• align-items
• auto-fit vs auto-fill
• Create an article layout
• An awesome image grid

• Learn CSS Grid
• 1. Intro to the CSS Grid course
• 2. Your first grid - CSS Grid tutorial
• 3. Frontend Career Path
• 4. Fraction units and repeat - CSS Grid tutorial
• 5. Positioning items - CSS Grid tutorial
• 6. Template areas - CSS Grid tutorial
• 7. Auto-fit and minmax - CSS Grid tutorial
• 8. Implicit rows - CSS Grid tutorial
• 9. An awesome image grid - CSS Grid tutorial
• 10. Named Lines - CSS Grid tutorial
• 11. justify-content and align-content - CSS Grid tutorial
• 12. justify-items and align-items - CSS Grid tutorial
• 13. Auto-fit vs. auto-fill - CSS Grid tutorial
• 14. Creating an article layout - CSS Grid tutorial
• 15. Grid vs. Flexbox - CSS Grid tutorial
• 16. Why are Solo Projects important?
• 17. Solo Project (PRO) - BBC News Clone
• 18. Congrats on completing the CSS Grid course!