Explore the powerful combination of subgrid and container queries in CSS layout design through this comprehensive 21-minute video tutorial. Learn how to set up a main grid, implement subgrid for rows and columns, and utilize container queries to create responsive featured elements. Discover potential pitfalls when combining these techniques and gain insights into creating flexible, dynamic layouts for modern web design. Follow along with provided code examples and additional resources to enhance your CSS skills and create more sophisticated, adaptable web layouts.
Overview
Syllabus
- Introduction
- What we’re starting with
- Setting up the main grid
- Setting the stage for using subgrid
- Adding in subgrid for rows
- Using a container query to change the style of a featured card
- Adding subgrid columns to the featured card
- Container queries can break subgrid
Taught by
Kevin Powell
