Hello Reader,

I had already written this week's newsletter when the Chrome dev team dropped CSS Wrapped 2024.

It's looks at 17 new features added to CSS this year, including demos of everything, and the site is a lot of fun to boot. Definitely go and check it out!

Now, on to what I'd already written for this week 🙂.

I get asked for advice about starting or growing a YouTube channel quite often.

I’m always very happy to share and help people out in any way I can, but I always let people know that I sort of accidentally grew my channel to what it is today.

Now, I don’t want to take away from what I’ve done, because I’m very proud of where my channel is now, but the only reason this channel didn’t peeter out and die after a few months is because of how I defined what success when I started it.

And, when I started, success was “have fun making videos, and see what this YouTube thing is all about”.

That was it.

I just saw making videos as possibly a fun hobby project that I could try.

I wasn’t worried about numbers or growing it into something awesome, I just wanted to give it try.

And I was successful to start, putting out 28 videos in the first 2 months.

My only goal was to try an consistently release videos, and I managed to do that.

If I’d set any expectations or goals for views or subscribers, I’m not sure if I would have continued.

Yup, over a 2-month period those 28 videos managed a total of 278 views, and I had 7 subscribers.

Out of all of those videos, the best performing one had 94 views, and my next best one had 21.

In other words, I was not an overnight success 😅.

A lot of people would be demotivated by these types of numbers, but because of how I’d defined success for my channel, I was happy to keep on going.

Now, I’m not saying the trick to life is setting low expectations.

Rather, it’s about defining what success is for whatever it is you’re working on before you start.

By defining success, it’ll bring up questions that you’ll need to answer before you start working on that project.

With my channel, I’d started off by saying it was a success if I consistently released videos, so I had to figure out how I’d do that.

• What would my videos be about?
• How and when would I plan them out?
• When would I record and edit them?
• How often did I want to be consistently releasing them?

If I was working on a side-project that I was hoping would make money, I’d have to ask other questions:

• Why would people pay for this?
• Who would pay for this?
• Should it be a one-time payment or monthly subscription?
• How do I convince people it’s worth paying for?
• How will I market it?
• Etc.

And those types of questions (and the many more you should be asking if you want people to buy stuff) should start to paint a picture of how much work you’ll actually have to put in to hopefully hit your goals.

And two people might build very similar projects with very different definitions of success!

One might just be happy if it makes for a kickass addition to their portfolio, whereas the other person might want to gain a large enough user base to sell it for 7-figures.

That means they should be asking very different questions, even if the product idea is the same.

Those questions answer how to approach the project and, hopefully, ensure that the goals are reached, or at the very least, set you on the right path to hitting those goals.

It might not work out, but at least you’re setting yourself up for success and being realistic with how much work it’ll be from the very get go.

And, of course, expectations can change over time.

Back in 2016 if a video hit 20 views, it was a success.

These days if a video only had 20 views only one minute after publishing it, I’d be wondering what went wrong!

🙋‍♂️ What I’ve been up to this week

The simple fix for your CSS overflow problems

​

If you’ve ever needed to have a menu or something similar overflow from its parent, but only in one direction, you probably ran into unexpected scrollbar issues while using overflow: hidden. Luckily, overflow: clip solves this problem!

Grid auto-fit, but with only an even number of columns

​

I got pulled into a thread in Bluesky with a question about how to use grid auto-fit, but preventing an odd number of columns.

I came up with a something, but it turns out there’s a really easy way to do it!

You just need to repeat the columns a second time, like so:

.auto-even-columns {
  display: grid;
  grid-template-columns: 
    repeat(auto-fit, minmax(100px, 1fr) minmax(100px, 1fr));
}

In this Short, I explain how this is working, and look at a few other ways you can use it as well.

Why competition is a good thing

​

The introduction section of this newsletter came about because of this week’s podcast episode (this link is for the podcast version, the above goes to YT), where I started off talking about why it’s worth starting something, even if there is already big players doing that thing.

As I was talking, it made me think a bit about the idea of how important setting expectations is, but it was a bit of a passing thought at the time, but when I gave it a listen back, it got me thinking more about that idea, and I decided to write about it in more detail.

🔗 Other awesome stuff around from the web

Managed to find a bunch of fun stuff to share this week, so some quick hits:

• ​Next-level frosted glass with backdrop-filter by Josh Comeau - You’ve seen this effect a bunch of times, but Josh shows us how to make it look awesome in this post.
• ​Writing good words for tech folks by Cassidy Williams - I’m always telling people to start blogs and to learn in public, here Cassidy gives some tips on how to write good content (and she’s also blogging every day this month, so go poke around in some of her other stuff too!)
• ​One of Those “Onboarding” UIs, With Anchor Positioning by Ryan Trimble - I’m in love with Anchor Positioning, and Ryan’s post starts with a great breakdown of getting started with it before moving into practical ways of using it.
• ​“Stuck” queries are coming! by Adam Argyle - This is more of a teason than anything, but super cool to see that we will soon be able to query when something using position: sticky is stuck and update it’s styles!
• ​Trackball Rotation using Quaternions - A really neat, small JS library to turn make your 3D CSS creations interactive, allowing them to be clicked and dragged to rotate them around.
• ​Native dual-range input by Stanko - Not everyone might need this (or the 3D rotater above), but it’s neat and I wanted to share it! It’s a nice solution if ever you need them, and very easy to make styling changes thanks to custom properties.

🏁 </newsletter>

Have a great week,
Kevin

​Unsubscribe · Preferences​
113 Cherry St #92768, Seattle, WA 98104-2205