Grid layout is a much needed step-change for CSS | Matt Hinchliffe, Front-End Developer

This is not only a really good explanation of CSS grid layout, it’s also a practical walkthrough, recreating the layout of the Financial Times. I think if I followed along at home, writing the markup and CSS outlined here, it would me to get this stuff “clicking” in my brain.

Tagged with

Related links

The Great CSS Expansion | Butler’s Log

Web development follows a familiar cycle. First we glue together a solution with whatever we have — JavaScript, image hacks, Flash, anything. Then the platform matures, and CSS or HTML eventually makes that same workaround native. Rounded corners, custom fonts, smooth scrolling, sticky positioning: all of these started as JavaScript-heavy hacks before CSS turned them into a single declaration.

We are in another one of those transition moments. A new wave of long-requested CSS features is finally landing, and many of them are explicitly designed to replace patterns that used to require JavaScript. Not as approximations — as first-class platform primitives that handle the edge cases, run in the right thread, and need zero dependencies.

Tagged with

Don’t judge a book by its cover

Some neat CSS from Tess that’s a great example of progressive enhancement; these book covers look good in all browsers, but they look even better in some.

Tagged with

NoLoJS: Reducing the JS Workload with HTML and CSS - Web Performance Calendar

You might not need (much) JavaScript for these common interface patterns.

While we all love the power and flexibility JS provides, we should also respect it, and our users, by limiting its use to only what it needs to do.

Yes! Client-side JavaScript should do what only client-side JavaScript can do.

Tagged with

I’m speaking at Web Day Out 2026 - Manuel Matuzovic

The core idea of the event is to get you up to speed on the most powerful web platform features that you can use right now. I love that because it aligns perfectly with what I’ve been working on over the last couple of years: finding ways to break old habits to get the most out of CSS.

Can’t wait!

Tagged with

Responsive Letter Spacing – Cloud Four

Another clever use of clamp() and calc() for web typography, but this time it’s adjusting letter-spacing.

Tagged with

Related posts

Speaking at Web Day Out

Have you got the perfect talk for this event? Let me know!

Announcing Web Day Out

A one-day event all about what you can in web browsers today: Brighton, March 12th, 2026. Tickets are just £225+VAT!

Underlines and line height

How to make the distance of link underlines proportional to the line height of the text.

Style your underlines

Make your links beautiful and accessible.

CSS snippets

Some styles I re-use when I’m programming with CSS.