You can't do this without subgrid

From the creator

As part of #SubgridAwarenessMonth I've looked a lot at what you can do with grid-template-columns: subgrid; but I haven't talked about rows at all. With rows, you can actually do some really awesome things, but this is a "gotcha" to using them, but they also fail very gracefully as well 😊 🔗 Links ✅ The code: https://codepen.io/kevinpowell/pen/KKqjrRO (only works in Firefox at the time of publication) ✅ The grid inspector: https://www.youtube.com/watch?v=m04RkJwzFgE&list=PL4-IK0AVhVjPv5tfS82UF_iQgFp4Bl998 ✅ My other subgrid videos: https://youtube.com/playlist?list=PL4-IK0AVhVjM4Kjqw_zN-Y3neCFXWPDJ2 ✅ Other grid videos: https://youtube.com/playlist?list=PL4-IK0AVhVjPv5tfS82UF_iQgFp4Bl998 ⌚ Timestamps 00:00 - Introduction 01:39 - The problem with regular grid 04:33 - Setting up the ",master" grid 06:28 - Adding the subgrid 08:15 - Solving the problem with grid-template-rows 09:51 - What happens in unsupported browsers? #css -- Come hang out with other dev's in my Discord Community 💬 https://discord.gg/nTYCvrK Keep up to date with everything I'm up to ✉ https://www.kevinpowell.co/newsletter Come hang out with me live every Monday on Twitch! 📺 https://www.twitch.tv/kevinpowellcss --- Help support my channel 👨‍🎓 Get a course: https://www.kevinpowell.co/courses 👕 Buy a shirt: https://teespring.com/stores/making-the-internet-awesome 💖 Support me on Patreon: https://www.patreon.com/kevinpowell --- My editor: VS Code - https://code.visualstudio.

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