Learn CSS Grid
Offered By: Independent
Course Description
Overview
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
- Grid Container
- Explicit Grid
- Minimum and Maxmum Grid Track Sizes
- Repeating Grid Tracks
- Grid Gaps (Gutters)
- Positioning Items by Grid Line Numbers
- Spanning Items Across Rows and Columns
- Naming Grid Lines
- Positioning Items by Line Names
- Naming and Positioning Items by Lines with the Same Name
- Naming and Positioning Items by Grid Areas
- Implicit Grid
- Implicitly Named Grid Areas
- Implicitly Named Grid Lines
- Layering Grid Items
- Aligning Grid Items (Box Alignment)
- Aligning Grid Tracks
Taught by
Jonathan Suh
Related Courses
Intro to HTML and CSSUdacity Responsive Web Design Fundamentals
Google via Udacity HTML5 and CSS Fundamentals
World Wide Web Consortium (W3C) via edX CSS Basics
Microsoft via edX Advanced CSS Concepts
Microsoft via edX