profile

Hi! I'm Kevin

Breakpoint-free grids, getting involved in the spec, and more

Published 5 months ago • 2 min read

​View this email in your browser (or share it with a friend!)

Hello Reader,

My newsletter has evolved over the last few years to have a few distinct sections it and it got me thinking… what is it that keeps people signed up for my newsletter?

Luckily, I have a way to find out!

So, what part of this newsletter gets you opening them each week?

I'll share the final results next week.

If you did pick the first part where I ramble about stuff, sorry to leave you disappointed this week as we head off into the next section.

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

Breakpoint-Free CSS Grid Layouts

video preview​

A look at Grid’s auto-fit and auto-fill, including how they are different, and the types of situations where you might want to use one over the other.

You can find a simplified version of the demo here, if you’d like to play around with them a bit.

🔌Shamepless Plug

In the video above, the project I'm using for the demo is part of a full website build that is the focus of my course on Frontend Masters.

The course looks at building out the entire page, including a few fun animations and view transitions (like you can see in the video above), but also tackles the more practical side of things, breaking down a project based on a Figma file, and how I approach building it from scratch.

Redesigning a page, live

video preview​

​HTML & CSS Tip of the Week was very quickly thrown together, and I wanted to improve the home page, so I did it as a live stream this past Friday.

If you visit now, the changes are live, but it still needs some work. I'm not sure on the date yet, but I'll continue all work on this site via live streams.

In the stream, I start by creating a two column layout for the homepage to make the articles easier to get to, as I figured it would be a better user-experience.

Then the chat suggested some updates to the navigation, so I looked at using a scroll-driven animation to slide the nav back in once a user had scrolled down a bit, and added a frosted glass effect to it with the help of an article by Josh Comeau that looks at how to make the frosted effect more realistic.

⚡ Quick hits

🎙️ Podcast: Getting more involved with CSS with Miriam Suzanne

This week I was joined by Mirian Suzanne for a super fun conversation that started off with talking about getting more involved in the CSS specification.

We got into the future of Sass, the future of CSS, and why we prefer "S" over "L" and "D".

LISTEN ON: APPLE | SPOTIFY | YOUTUBE | WEB​

🔗 Other awesome stuff around from the web

Some mostly CSS-related links that I enjoyed or thought were interested, that I came across in the past week:

🏁

Have a fantastic week!
Kevin

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

Hi! I'm Kevin

Weekly newsletter, where I talk about tangentially-related front-end development topics and share what I've been up to in the last week, plus any cool/fun/interesting/useful links I come across as well.

Read more from Hi! I'm Kevin

View this email in your browser (or share it with a friend!) Hello Reader, Sometimes when I try out a CSS feature to test something out quickly, it does whatever it promised to do, I’m happy, and I move on to other things, storing it away for when I might need it. Other times, I go down a bit of a rabbit hole, which I did this week when testing something out with anchor positioning. I wanted to test out if I could create a transition when changing what an element was anchored to… and it turns...

3 days ago • 4 min read

View this email in your browser (or share it with a friend!) Hello Reader, Next week is the last week of school for my kids… which is insane because how did we manage to get this far into the year already?! It also means that I’ll be doing a little less work than usual, as there’ll be a bit more family time, activities, and travels going on, especially through July for me. I’ll still be putting out this newsletter, and I have a backlog of YouTube videos recorded, so the regular stuff will...

17 days ago • 3 min read

View this email in your browser (or share it with a friend!) Hello Reader, Lots of content this week… meaning I was busier than usual and we’re skipping the general musings for this week! 🙋♂️ What I’ve been up to this week Create this trendy blurry glass effect with CSS I didn’t plan for this to coincide with Apple’s new Liquid Glass UI, but I guess the timing was good! It’s not the exact same thing as what Apple’s Liquid Glass, but with the hot mess it is in terms of accessibility, that...

25 days ago • 4 min read