Using CSS Grid the right way | hey it’s violet

CSS Grid is easy to use but difficult to learn. It’s a more intuitive paradigm than any other CSS layout technique, but it’s completely different from its predecessors.

Some great advice here on how to approach CSS grid:

  • Use names, not numbers
  • Use fr as your flexible unit
  • Don’t use a grid system
Using CSS Grid the right way | hey it’s violet

Tagged with

Related links

Hack to the Future - Frontend - Matt Hobbs

Put the kettle on. This is a long one!

Matt takes a trip down memory lane and looks at all the frontend tools, technologies, and techniques that have come and gone over the years.

But this isn’t about nostalgia (although it does make you appreciate how far we’ve come). He’s looking at whether anything from the past is worth keeping today.

Studying past best practices and legacy systems is crucial for understanding the evolution of technology and making informed decisions today.

There’s only one technique that makes the cut:

After discussing countless legacy approaches and techniques best left in the past, you’ve finally arrived at a truly timeless and Incredibly important methodology.

Tagged with

CSS Intelligence: Speculating On The Future Of A Smarter Language — Smashing Magazine

This is a really thoughtful look at the evolution of CSS and the ever-present need to balance power with learnability.

Tagged with

Item Flow, Part 1: A new unified concept for layout | WebKit

I really like the idea of unifying some layout values in CSS. If you’ve got any feedback, please chip in!

Tagged with

Knowing CSS is mastery to Frontend Development — Anselm Hannemann

Anselm isn’t talking about becoming a CSS wizard, but simply having an understanding of what CSS can do. I have had similar experiences to this:

In the past years I had various situations where TypeScript developers (they called themselves) approached me and asked whether I could help them out with CSS. I expected to solve a complex problem but for me — knowing CSS very well — it was always a simple, straightforward solution or code snippet.

Let’s face it, “full stack” usually means “JavaScript”—HTML and CSS aren’t considered worthy of consideration. Their loss.

Tagged with

New CSS that can actually be used in 2024 | Thomasorus

Logical properties, container queries, :has, :is, :where, min(), max(), clamp(), nesting, cascade layers, subgrid, and more.

Tagged with

Related posts

Who knows?

Had you heard of these bits of CSS? Me too/neither!

Bugblogging

Also, tipblogging.

Media queries with display-mode

I never would’ve known about the `display-mode` media feature if I hadn’t been writing about it.

Getting started

Links for someone looking to get started in web development.

CSS grid in Internet Explorer 11

IE11 doesn’t support CSS grid.