Container Queries are going to be a game changer!

From the creator

I think container queries easily have the potential to be as big of a game-changer as flexbox was back in the day. They are going to change the way we approach creating layouts. The proposal by Miriam Suzanne build on top of David Baron’s, and is what is currently being implemented into Chrome Canary (behind a flag), so a huge thank you to her for being at the forefront of making this actually happen! //////////// UPDATE /////////// If you want to try them out, the contain property now has a new requirement, with the `style` value. `contain: layout style inline-size;` ////////////// *** If you'd like to react to certain aspects, or suggest changes to this proposal *** The proposal currently lives in a GitHub Repo where you can keep track of its progress, as well as make contributions to as well! This is really early days, and they are looking for feedback, issues, and ideas to help move it forward! https://github.com/w3c/csswg-drafts/issues/5796 🔗 Links ✅ Chrome Canary:https://www.google.com/intl/en_ca/chrome/canary/ ✅ Miriam Suzanne's proposal: https://github.com/w3c/csswg-drafts/issues/5796 ✅ Miriam Suzanne's explainer: https://www.miriamsuzanne.com/2021/05/02/container-queries/ ✅ A Primer On CSS Container Queries: https://www.smashingmagazine.com/2021/05/complete-guide-css-container-queries/ ⌚ Timestamps 00:00 - Introduction 01:36 - Enabling container queries in Chrome Canary 03:00 - Looking first at media queries 04:23 - When container queries enter the pictur

Published 2021-05-20 · Watch on YouTube ↗
Availability and playback restrictions are controlled by the original channel.