Latest Articles

The Pitfalls of In-App Browsers

By Paul Esch-Laurent on July 17, 2024

You should know that in-app browser can and do literally inject JavaScript into the websites you visit with them with tracking scripts from the app you’re inside of. And that’s just one thing that sucks about them.

Blogging CSS Design HTML

Notes On “Microfeatures I Love in Blogs and Personal Websites”

By Chris Coyier on July 15, 2024

Danila Fedorin’s article about unique UX features in blogs is fun. Here’s some extra thoughts, resources, and opinions.

CSS Mixins Style Queries

Style Queries are Almost Like Mixins (But Mixins Would Be Better)

By Chris Coyier on July 12, 2024

Having a named block of styles to apply in CSS can be useful, and newfangled Style Queries are pretty close to that. We look at one use case here, how Sass did mixins better, and hope for a native solution.

CSS Overflow

Single-Directionally Allowed Overflow

By Chris Coyier on July 10, 2024

CSS allows setting different overflow behaviors for x and y directions. It doesn’t actually work with the `hidden` value, but it does with `clip`!

CSS Game Scroll-Driven Animations

How Keyboard Navigation Works in a CSS Game

By Temani Afif on July 8, 2024

The navigation in this game works with the arrow keys, which is made possible with scroll driven animations, faked collision detection, and maintaining state with CSS custom properties.

JavaScript Security Subresource Integrity

Script Integrity

By Chris Coyier on July 5, 2024

Polyfill.io recently served malicious code, redirecting users to inappropriate sites. Subresource Integrity (SRI) can help prevent such issues by verifying script integrity.

Color CSS Dark Theme Email

Why is this thing in Dark Mode?

By Chris Coyier on July 3, 2024

The website has the most control, since that’s what applies the CSS. But browsers also have a Dark/Light/System setting, and that can fall through to the OS/Device.

Alvaro Montoro has a great thread (and blog post) of a bunch of CSS value functions in “the first public draft of the CSS Values and Units Level 5 Module”. It can’t be overstated how powerful some of this stuff is going to be. The attr() stuff enables much more a powerful realtime HTML<>CSS connection. The sibling-*() functions will be fantastic for staggering effects and quanity-driven layouts. And giving us runtime random() will unleash lots of interesting design creativity.

Papa bear’s porridge is hot. Web Components Are Not the Future: “Web Components possibly pose the biggest risk to the future of the web that I can see.” — Ryan Carniato
Mama bear’s porridge is cool. Web Components Are Not the Future — They’re the Present: “If you’re convinced that your way is the best and only way, it’s natural to feel disenchanted when a decision is made that you don’t fully agree with.” — Cory LaViska
Baby bear’s porridge is jusssst right. Web components are okay: “I find these debates a bit tiresome. I think the fundamental issue, as I’ve previously said, is that people are talking past each other because they’re building different things with different constraints.” — Nolan Lawson

There is a meta conversation of “Web Components are very definitely going to be around 10 years from now while any JavaScript framework today will not” is worth considering, but pits the two directly against each other when we really don’t need to.

Little boosts of front-end development news, information, and advice — right to your feed reader of choice.

RSS

After the big shakeup with masonry layout recently (Apple: Make it part of display: grid;! / Google: Make it display: masonry;! / Me: I’ve got questions and I’d rather see tabbing order issues fixed first), I was very keen to hear where it would go. It took 5 months, but we’ve got movement.

The CSS Working Group has combined the two CSS masonry proposals into one draft specification. The group hopes that this will make it easier to compare the two, and make a final decision. The Chrome team still believes that a separate masonry syntax would be the best way to proceed.

I admit I find it a bit brain-bending and mostly don’t care which way it goes. Both Geoff and Miriam have fantastic overviews and also both stop short of a strong opinion either way. To keep it spicy, I have a slight preference for keeping it in grid, as adding four new properties for this relatively niche layout need feels like a bit much, even if it does complicate grid by existing. Rachels feels strongly the other way.

I love the Interop project. We’re a couple of years into it, and each year it worked just like it was supposed to: features are chosen, those features are implemented (or fixed up) across all browsers. Choosing the features is somewhat democratic, and submissions are open for 2025. Remember last year I measured the positive sentiment of the open issues and compared it to what was ultimately chosen. It wasn’t terribly correlated but we did get some “popular” stuff still. There are already quite a few submissions. I’ve got some favorites already but I need to think a bit more to pick my favorites.

Wanna write?

Here's our page on guest writing. It's a win-win-win!

Latest Articles

The Pitfalls of In-App Browsers

Notes On “Microfeatures I Love in Blogs and Personal Websites”

Style Queries are Almost Like Mixins (But Mixins Would Be Better)

Single-Directionally Allowed Overflow

How Keyboard Navigation Works in a CSS Game

Script Integrity

Why is this thing in Dark Mode?

The Beat

Subscribe

Wanna write?

Did you know?

Latest Articles

The Pitfalls of In-App Browsers

Notes On “Microfeatures I Love in Blogs and Personal Websites”

Style Queries are Almost Like Mixins (But Mixins Would Be Better)

Single-Directionally Allowed Overflow

How Keyboard Navigation Works in a CSS Game

Script Integrity

Why is this thing in Dark Mode?

The Beat

CSS Value Functions that are… exciting?

Web Components are Bad, Good, and OK

Masonry Feedback, Round 2

Interop 2025