YoVDO

Creating a Robust Grid System Using Subgrid

Offered By: Kevin Powell via YouTube

Tags

HTML & CSS Courses Web Development Courses Responsive Design Courses CSS Grid Courses Subgrid Courses

Course Description

Overview

Explore the power of subgrid in CSS by building a robust grid system in this 36-minute tutorial video. Learn to set up a master grid, place child elements, create and fix subgrid layouts, and improve the overall structure using custom properties. Discover techniques for responsive design at larger screen sizes, create custom sections, and break out of container constraints. Gain insights into hero area design and advanced grid techniques. Follow along with provided code examples and expand your CSS grid skills to create more flexible and maintainable layouts.

Syllabus

- Introduction
- Setting up the master grid
- Placing the children on the grid
- Creating the subgrids
- Fixing the subgrid layouts
- Creating a more robust master grid
- Improving the master grid with custom properties
- Getting things on our grid at larger screen sizes
- Custom sections with custom properties
- Breaking out of the "container"
- The hero area


Taught by

Kevin Powell

Related Courses

The CSS Podcast
Independent
Creating a Layered Card With HTML & CSS
Kevin Powell via YouTube
CSS Grid - What is this Magic?
NDC Conferences via YouTube
Hello Subgrid!
JSConf via YouTube
Creative CSS Layout - Modern Techniques and Tools
Web Conferences Amsterdam via YouTube