|
PRE-S: Proposals for Interop 2026 are now open. For those who don't know, Interop is an initiative to ensure that all browsers properly implement features outlined in the web specifications, which means not only do they support those features, but they are bug-free. You can learn more about it here, and if you would like to propose a feature, I'd suggest you read this guide first. |
|
|
Hello Reader,
Working from home has a lot of benefits, but during the summer when my kids are home, they have a hard time understanding that if I’m in my office, it means I’m “at work.”
And as my kids get older, I also realize I need to cherish the moments when they still want to spend time with me… but damn does it make it hard to get much work done 😅.
Today, though, I have some peace and quiet as I write this, because they left for the first day of school just minutes ago. It feels a little strange to celebrate that, but it is nice to have some quiet work time!
And boy, do I need to get to work 😂.
I’ve got a long list of things that I’m working on, as I talked about in last week’s podcast episode, and I’m trying to sort everything out and stay organized and on top of it all, and making sure to keep my priorities straight while I’m at it, because I’m also very good at getting distracted!
So because of that, we’re going to keep this intro a little shorter this week and jump into the content, and as you might be able to tell from the formatting below, the "I like the sections with the background colors" overwhelmingly won the vote, followed by no-preference didn't notice, with only 4.6% of people saying they liked it less.
🙋♂️ What I've been up to this week
1,000 video spectacular
I hit 1,000 videos this week, so to celebrate, I did a live stream where I started by playing a CSS Quiz game and then a long AMA, mixed in with random demos and playing around with CSS throughout.
(I said I would send out an email when I had planned a specific date for this and completely forgot to, sorry about that!)
HTML & CSS form tutorial / Frontend Mentor
In this video I take a look at styling up a form that looks deceptively simple, but has a few intersting things, such as the radio button areas, and I show an issue with fieldset styling, and how to overcome it.
Two Idiots Argue With Kevin Powell About CSS
Forgot to add this last week, but I was a guest on ShopTalk show! This was pretty special, as I've been listening to Dave and Chris since before I even started my YouTube channel, and it was an absolute blast talking about content creation, CSS, and more.
If you prefer, here is the podcast/audio-only version.
Deep dive into the fr unit
This is a special release that won't go public on my YouTube channel. I did this live over on my Discord server, as I was trying to talk out loud to help me figure out the best way to explain how the `fr` unit works.
It involves some poking around in the spec and mucking around with demos, and in the end I'm happy with where I got!
I didn't think of recording it at the start, so the beginning is a bit abrupt, but you won't have missed anything important.
At the end, I got asked a question about Grid and having a bit more content around it, so I'm planning to do a CSS Grid Workshop over in the Discord two weeks from now.
I realize Discord isn't for everyone, but it worked well here with the live chat, along with a "call in" option as well.
|
⚡ Quick tips of the week
A quick look at a couple of use cases for single colour gradients.
|
|
|
🎙️ Podcast
The evolving state of CSS and the web
The podcast is back!
Starting with a dive into an article about the light-dark() function and theming in CSS, I ramble my way through topics of browser support of new features, browsers fixing issues with existing features, and some talk about the spec and how we can all help out in improving the current state of things.
LISTEN ON: APPLE | SPOTIFY | YOUTUBE | WEB
|
|
🔗 Other awesome stuff around from the web
|
📝 Quiz time!
Sticking with our Layout theme for September: In CSS Grid, what happens when you use grid-auto-flow: column with grid-template-rows: repeat(3, 1fr) but don’t define columns?
- Creates columns for all the direct children, the rows do nothing
- Creates 3 rows, and if there is more than 3 direct children, adds more columns
- Creates 3 rows, and if there are more than 3 children, it repeats 3 more
- grid-auto-flow isn’t a real property, so it doesn’t do anything
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.
|
|
🏁
Have a fantastic week! Kevin
Are you looking to step up your CSS? I've got both free and premium courses to help with that! They cover a range of skill levels too 👇
Beginner friendly (and free)
Conquering Responsive Layout
A free course to help you approach responsive layouts with the right mindset.
Enroll →
|
|
Intermediate
CSS Demystified
For those who've been writing CSS for a little bit now, but want to step up their game and start writing CSS with confidence!
Enroll →
|
|
Advanced
Beyond CSS
An advanced course that dives into project architecture, theming, design systems, and more.
Enroll →
|
|
|
|
|
If you no longer want to get any emails from me, you can unsubscribe or you can edit your preferences if you'd like pick which emails you get from me. 113 Cherry St #92768, Seattle, WA 98104-2205 |
|
|