CSS Nesting is Here!

Syntax - Tasty Web Development Treats

Wes Bos

Tech News, News, Technology

4.9 • 1.2K Ratings

🗓️ 11 September 2023

⏱️ 31 minutes

🔗️ Recording | iTunes | RSS

🧾️ Download transcript

Summary

In this Hasty Treat, Scott and Wes talk about the arrival of CSS nesting. What is CSS nesting? How does CSS nesting work? And does it work in all browsers? Show Notes 00:24 Welcome 02:31 What’s up with CSS nesting? "CSS Nesting just landed in Firefox 117 which puts it at 100% browser support! You can start using it today — here are 11 examples on how it works 👇 04:10 How does CSS nesting work? 09:23 What the ampersand does in nesting 21:05 It works with media queries 25:29 How does it work on all the browsers? 29:32 Lightning CSS Lightning CSS Tweet us your tasty treats Scott’s Instagram LevelUpTutorials Instagram Wes’ Instagram Wes’ Twitter Wes’ Facebook Scott’s Twitter Make sure to include @SyntaxFM in your tweets Wes Bos on Bluesky Scott on Bluesky Syntax on Bluesky

Transcript

Click on a timestamp to play from that location

0:00.0	Monday, Monday, day, open wide dev fans, get ready to stuff your face with JavaScript CSS,
0:08.2	Node modules, barbecue tips, get workflows, break dancing, soft skills, web development,
0:12.9	the hastiest, the crazyest, the tastiest, web development treats, coming in hot, here
0:18.7	is Wes Barakuda, Boss and Scott El Torro Lugo, Tolinsky.
0:26.3	Welcome to syntax, this is the podcast with the tastiest web development treats out
0:30.6	there.
0:31.6	CSS nesting is here and we are going to tell you all about it, how it works, how to get
0:38.8	it to work in every single browser that gotchas to think about and shouldn't you not use
0:46.5	that.
0:47.5	So I put out a tweet the other day about CSS nesting, it had landed in Firefox 117, which
0:52.6	means that it is now in every single browser out there and it can be compiled back to
0:58.7	every like all the way back to i.e. three or something silly like that.
1:03.5	So you can start using this today, but I got a lot of with post CSS, right?
1:08.4	Exactly.
1:09.4	Yeah, exactly.
1:10.4	But a lot of people were like very angry about nesting, which I understand because they
1:16.0	probably have dealt with a lot of garbage code and you probably are nesting more than
1:23.3	you should, but it's still handy and we're going to talk about why that's handy and what
1:29.7	not.
1:30.7	How are you doing today, Scott?
1:32.2	I'm doing good, man.
1:34.3	Doing super good.
	...

Please login to see the full transcript.

Previous episode | Next episode

Disclaimer: The podcast and artwork embedded on this page are from Wes Bos, and are the property of its owner and not affiliated with or endorsed by Tapesearch.

Generated transcripts are the property of Wes Bos and are distributed freely under the Fair Use doctrine. Transcripts generated by Tapesearch are not guaranteed to be accurate.