YoVDO

Subgrid and Container Queries: Creating Dynamic Layouts in CSS

Offered By: Kevin Powell via YouTube

Tags

CSS Grid Courses Responsive Design Courses Subgrid Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
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.

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

Related Courses

Creating a Robust Grid System Using Subgrid
Kevin Powell via YouTube
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