When should you use CSS Grid?

Here are five realistic examples for when I reach for CSS Grid.
🔗 Key Links 🔗
- Github: github.com/coding-in-public/5-grid-examples
---------------------------------------
📹 Related Videos 📹
- CSS Grid Intro video: kzbin.info/www/bejne/ZnWzqIqGZpmUi9U
---------------------------------------
⏲️ Timestamps ⏲️
0:00 Introduction
0:20 Example 1: Centering
1:09 Example 2: Vertical Column
3:47 Example 3: Page Layouts
6:04 Example 4: Complex Positioning
11:03 Example 5: Responsive Grids
---------------------------------------
🌐 Connect With Me 🌐
- Website: codinginpublic.dev
- Blog: chrispennington.blog
- Twitter: cpenned
- Patreon: www.patreon.com/coding_in_public
- Buy Me a Coffee: www.buymeacoffee.com/chrispennington

[@anfytrion]

I'd love to see more CSS videos

[@CodinginPublic]

Cool! Will put more together!

[@joaopbeltrami]

Love your content! Keep it up

[@CodinginPublic]

Thanks for the kind words!

[@Giglamox]

Awesome video. Thanks!!!!!

[@CodinginPublic]

Glad you liked it!

[@domingouribe]

I like your way of work. Thanks for share!

[@CodinginPublic]

Thanks for the kind words!

[@mrrolandlawrence]

grid also makes a super quick timeline component. so handy for itineraries.

[@CodinginPublic]

Yep! Another great use case!

[@shu9460]

Chris have you given up on your Astro course? Haven't seen any updates lately. All the people who bought early access to it you owe it to them to finish it in a timely manner.

[@velhoguidsd]

For some reason example 3 didn't work for me.

[@CodinginPublic]

You may need to ensure min-height: 100vh is set on the body.