A weekly email newsletter with the most interesting news, ideas, fresh content, thoughts, and incredibly mature jokes from Team CSS-Tricks. This is your ticket to saying up to date with web dev.
View this newsletter on the web.
[Robin]: Last week we talked a bit about weird browsers and why I’m so gosh-darned excited for them. Well, this week I’ve been thinking a bit about weird tools for making websites like utopia.app…
View this newsletter on the web.
[Robin]: “Perhaps for what we’re losing in browser engine diversity, we’ll gain in browser UI/UX diversity” Chris quipped the other day in a post all about Bonsai. It’s an interesting little browser that’s …
View this newsletter on the web.
[Robin]: Jamstack Conf 2021 wrapped earlier this week and I’m slowly catching up on the videos from the event. There’s lots of good stuff in there, so make sure to bookmark that for …
View this newsletter on the web.
[Robin]: Here’s my photo of the week: a picture from a 2015 blog post by Paul Irish of the Wikipedia team walking through an enormous printed version of their performance timeline:
As bananas …
View this newsletter on the web.
[Robin]: Harry Roberts has been doing a ton of interesting work when it comes to the <head> element and—no! stop yawning!—there’s good reason for that; it’s the place where all performance problems begin. Or, …
View this newsletter on the web.
[Robin]: Let’s start this week off with something odd and fun. I stumbled upon this interesting form pattern by Hakim El Hattab:
This is neat because I’ve never thought that a focus state could …
View this newsletter on the web.
⚛
[Robin]: One of the criticisms thrown at writing Atomic CSS is that it generates a ton of classes that your users don’t need. Let’s say you want to add some padding to …
View this newsletter on the web.
[Robin]: Everything on the web is a rectangle. No matter what element you choose or what CSS you write, under the hood you’re always filling up the page with squares and rectangles of various …
View this newsletter on the web.
[Robin]: I stumbled upon this nifty VS Code plugin called TabOut this week that lets you hit the tab key and jump between quotes in a line of code. It’s a brilliant plugin because …
View this newsletter on the web.
😯
[Robin]: This week I’ve been thinking about page transitions on the web and this post from Chris earlier this year:
…We can technically build page transitions now, even without single-page-app architecture, but what
View this newsletter on the web.
😲[Robin]: Let’s say you need some margin and padding utility classes. In Tailwind, for example, you’d write some HTML like this:
<div class="pt-6">...</div>This sets the padding-top CSS property to 6 in …
View this newsletter on the web.
[Robin]: Lately in the newsletter, we’ve written about neat things we’ll be able to do with CSS in the future. CSS nesting! Container queries! Query units! New pseudo-elements! All this is very exciting but …
View this newsletter on the web.
👀Nesting CSS classes is pretty handy. If you’re familiar with preprocessing languages like Sass and Less then you’re probably used to nesting like this:
.card {
.card-text {
font-size: 1em;
}
&.card-large {
View this newsletter on the web.
Chris here, filling in for Robin, our usually weekly correspondent. And speaking of Robin, you should subscribe to his blog, as it’s a great personal blog, which he’s moving to Astro and writing …
View this newsletter on the web.
[Robin]: Have you ever heard of CSS query units? They aren’t a thing in CSS just yet, but let me set the stage to explain exactly how they would be useful. I only stumbled …
View this newsletter on the web.
I have a terrible confession to make. Send me to jail and lock away the key because, despite how much I rant about variable fonts, I’ve never really used them. I’ve read tutorials and …
View this newsletter on the web.
[Robin]: I’ve been in my fair share of meetings over the years; those that were unfocused and a bit rambling, those that were unclear about why they even needed to be meetings in the …
View this newsletter on the web.
[Robin]: When it comes to web development I feel like images have been in a state of constant flux over the past few years. What’s the best way to add an image to a …
View this newsletter on the web.
[Robin]: Max Böck asks when should we use @container or @media queries?
…While I think container queries will eventually replace most “low level” responsive logic, there are still a lot of good usecases
View this newsletter on the web.
[Robin]: Exciting news! This week Astro was formally introduced — it’s a static site builder that is, well, pretty gosh darn exciting:
…In Astro, you compose your website using UI components from your favorite
Frontend Masters is the best place to get it. They have courses on all the most important front-end technologies, from React to CSS, from Vue to D3, and beyond with Node.js and Full Stack.
