Hello Reader,
I’ve been doing a lot more interviews with people over on my second channel over the last few weeks. Only one of those conversations has been posted sso far, with the others coming soon.
The reason I mention this, though, is that one question I like to ask my guests near the end, when I do a rapid-fire segment, is “Is there a CSS best practice that you disagree with?”
The reason I like asking that question is that so many CSS “best practices” seem to fall into one of two categories:
- Great advice for beginners to help keep things simple
- Rooted in the way CSS worked 10+ years ago
And there are a lot of things that we do more out of habit at this point, rather than because it makes sense to do so.
A good example comes from Miriam Suzanne, who recently wrote about one of the things I’ve been thinking about, which is how maybe we don’t need to bother with the box-sizing reset.
Another thing that I’m doing my best to fight against is the idea that we should use a single class for everything, rather than using all the selectors we have at our disposal, including descendant selectors and other combinators. I still get a lot of pushback in the comments of videos on this.
Mobile-first is another concept that, while I agree with in general, I think it’s an overgeneralization that shouldn’t be used as a hard-and-fast rule.
(sidenote: people are also overly passionate about desktop-first and get mad at me for suggesting the other way around is often easier for their projects that involve web apps that are going to be used for internal purposes at their company, and are only intended for desktop use... so yeah, the whole point I'm usually trying to get across is to write the simplest and easiest to maintain code, so do what's best!)
Some of the pushback comes from the fact that we need to simplify how CSS is written, because teams of people poke in and out and edit files, and it all needs to be easily understood… but as CSS evolves and becomes more and more powerful, it’s also going to get more and more complex.
Does that mean we should avoid the added complexity that comes with some modern features, or does it mean teams should hire more specialists who can take full advantage of what it can do, and let the JS people stick to what they know best?
You probably know where I stand on that… so I guess the real question is, how can we make that actually happen?
🙋♂️ What I’ve been up to this week
I know people don’t like learning about features that they can’t use yet, so while one of my videos was on that, I put out a second, more practical one as well.
The heading selector I’ve been waiting so long for is finally here! (sort of)
 The :heading and :heading() pseudo-classes are in Firefox Nightly (behind a flag), and I’m so happy to finally see some movement on these because they’re such a useful feature.
Common things people get wrong about Flex and Grid
 There are a lot of CSS misconceptions out there in general, and today I’m tackling two of the biggest layout-related ones: How flex: 1 works, and the idea that Flexbox is inherently simpler than Grid.🙋♂️ What I've been up to this week
I know people don’t like learning about features that they can’t use yet, so while one of my videos was on that, I put out a second, more practical one as well.
|
🎙️ Podcast
Zero-day CSS vulnerability
CSS was hacked! Or well, there was a zero-day vulnerability. This is the first time I do a “reaction” type video, and you can find the original one here.
LISTEN ON: APPLE | SPOTIFY | YOUTUBE | RSS
|
|
🔗 Other awesome stuff around from the web
Speaking of RomaSpeaking of Roma, he joined Miriam and Stacy on an episode of Winging It where they dove into native CSS functions and mixins.
And for those of you interested in upping your design game, Piccalilli’s course Mindful Design is accepting pre-orders right now, with 30% off until the end of September.
|
📝 Quiz time!
A few weeks ago I had a tricky selector question that most people got wrong (only 14% got it correct!). This one's tricky too, but a bit different: Only one of these selectors is valid, which one is it?
- :is(> *)
- :has(> *)
- :not(> *)
- :where(> *)
As per usual, you'll have to head on over to YouTube to take a stab at the quiz, and once you answer, you'll see if you were right or not.
|
|
🏁
I've mentioned this a few times, but in case you've missed it, I am hosting a new workshop with Frontend Masters next month, and they're currently running a big sale!
So, if you sign up during the sale period, you'll gain access to my existing workshop with them, as well as exclusive videos I'm creating for them, plus all access to their extensive catalogue... and you'll be able to attend my new workshop as well 😊.
Both of those links are affiliate links, so if you sign up following them, it also helps support what I'm doing.
Have a fantastic week!
Kevin
