Tag: CSS
The Programmer’s Fulcrum 7 August, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and Open Social development communities with a focus on devastating big tech via Techno Anarchism. As usual, we aim to provide actionable content you can use to destroy...
Kevin Powell Trying Out Prop For That
Kevin Powell tries out Prop For That , makin it look so slick and easy 🫶 Watch on YouTube
Max Value Of A CSS Length Layout Unit
33554432px the maximum value for a CSS length in a layout context. #randomCSSfacts Bramus on Masto
The Programmer’s Fulcrum 31 July, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and Open Social development communities with a focus on devastating big tech via Techno Anarchism. As usual, we aim to provide actionable content you can use to destroy...
CSS Infinity Use Cases
Some practical, some wild
The Programmer’s Fulcrum 24 July, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and Open Social development communities with a focus on devastating big tech via Techno Anarchism. As usual, we aim to provide actionable content you can use to destroy...
The 1 Line of CSS That Blew My Mind
You even come across a piece of code so divine that warps your mind through time and space and it forever changes the way you build websites? Well, dear Penthouse Forums, I never though it would happen to me...
100 Ways To Center A Div
100 ways to center a div by Temani Afif
The Programmer’s Fulcrum 17 July, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and Open Social development communities with a focus on devastating big tech via Techno Anarchism. As usual, we aim to provide actionable content you can use to destroy...
image-orientation: How CSS Solved the EXIF Rotation Problem
In 2012, EXIF orientation handling varied wildly across browsers and web services. The image orientation CSS specification has since standardized how browsers honor that data by default, but there are still edge cases that bite.
Throwing Confetti with CSS Random
Throwing some confetti while exploring the CSS random() function through its specification and its current implementations, finding both the beauty and the pitfalls along the way.
The Programmer’s Fulcrum 10 July, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and Fediverse development communities with a focus on devastating big tech via Techno Anarchism. As usual, we aim to provide actionable content you can use to destroy Techno...
Animating Element with Only CSS
This post provides the most straightforward and minimum way to animate the HTML detials element using only CSS.
Quick Hit #159
Firefox 154 (Nightly) will ship text-box, text-box-trim, and text-box-edge, making them Baseline.
Quick Hit #158
Safari TP 247 becomes the first to trial calc-mix(), which returns a progress point between two values.
The Programmer’s Fulcrum: 3 July, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and open social development communities with a focus on devastating big tech via Techno Anarchism. As usual, we aim to provide actionable content you can use to destroy...
Blogging with Magic Unicode: Simple Doesn't Have to Mean Boring!
You don't need bloat. You can use CSS variables and Unicode symbols to add visual personality to your personal website while keeping it minimal, accessible, and fast-loading. Includes a reference of symbol sets (celestial, elemental, occult, card suits, chess, zodiac, and more) with colour examples using the Gruvbox palette.
Quick Hit #157
Chrome 150 becomes the first to ship animatable zoom, flex-wrap: balance, overscroll-behavior: chain (chaining with no overscroll), named-feature(), corner rounding for polygon(), and finally, the focusgroup attribute.
Quick Hit #156
Chrome 150 implements comma-separated container queries as well as support for light-dark(), following Firefox support.
OKHST: predictable color generation for real interfaces
OKHST is a tone-based color space for generating UI palettes that behave more predictably across states, dark mode, and high contrast.
Quick Hit #155
Chrome 150 ships background-clip: border-area (supported by Safari already).
Quick Hit #154
Chrome 150 implements the AccentColor/AccentColorText system-color keywords, making them Baseline.
Progressively enhancing Grid Lanes
This post is a follow-up on my previous post. I was wondering whether it's safe to use Grid Lanes today. I came up with a solution I find okay, but there is a caveat.
Redecoration and un-Sassing my site
Over two months ago, I launched an update to my site. I would feel uncomfortable using the word redesign. Most of the work was behind the scenes.
Working with CSS Container Queries for the first time today, and they don't quite work how I expected them to work. It's leading to me having to declare selectors in ways that are not natural to me, although the selectors are working as expected. In short, it's making me think, harder than most days.
Quick Hit #153
Firefox 154 (Nightly) ships progress(), advanced attr(), and a UI for and .
Your Grid Lanes will likely fail WCAG 2.4.3
I saw a great introduction to CSS Grid Lanes, aka Masonry Layouts, by Patrick Brosset at CSS Day 2026. I liked the versatility of its use cases, but I was also concerned that it's inaccessible by default.
decoding=async can break multipage view transitions
Turns out optimizing for performance can actually harm user experience... Did you know that decoding "async" can break multipage View Transitions? When a view transition is triggered, the browser captures a snapshot of the new page to animate from. If an image is still decoding asynchronously at tha...
Quick Hit #152
Chrome 150 (Beta) and Firefox 154 (Nightly) trial the alpha() relative color CSS function.
Setting the width of selects to the width of the selected option
The field-sizing property is coming to Firefox 152, making it available across all major engines. It allows you to control the sizing behavior of elements with a default preferred size, such as form elements.
Quick Hit #151
Safari TP 246 becomes the first to trial the alpha() relative color CSS function.
Quick Hit #150
Safari TP 246 trials scroll-state queries and word-break: auto-phrase (lacks Firefox support).
Quick Hit #149
Safari TP 246 adds support for values in light-dark() and three or more values in color-mix() (lacks Chrome support).
Quick Hit #149
Safari TP 246 adds support for values in light-dark() and three or more values in color-mix() (lacks Chrome support).
Prop For That
Everything JS knows, now CSS knows.
Contextualism Talk At CSS Day 2026
✅ talk "Contextualism" at CSS Day 2026 Slides · Prop For That
css-expect: browser-backed unit tests for CSS custom functions
css-expect enables you to write unit tests for your CSS @functions using the browser engine itself as the source of truth.
CSS Day 2026
🛬 Landed and stoked for CSS Day 2026! 💀 Tattoo scheduled 🤜🤛 Excited to see fellow CSS nerds 🎁 Have a special surprise at the end of my talk that I can't wait to reveal
@function — Native Custom Functions in CSS
CSS now has user-defined functions. No preprocessor, no JavaScript, but native @function with typed parameters, local variables, and conditional logic built right into your CSS.
The Programmer’s Fulcrum: 5 June, 2026
This post originally appeared on The Fulcrum. Welcome to this week's The Programmer's Fulcrum. It's your weekly curation of the essential news in the Open Media Network and Fediverse development communities with a focus on devastating big tech via Techno Anarchism. The big news this week was obviously The European Commission's European Technological Sovereignty Package....
"Every Layout" Mixins
Every Layout is a collection of composable CSS layout patterns. Here's how I've extracted them into a reusable pattern library I can use in any project.
Lowering the Barrier to CSS @property Adoption
CSS @property has been Baseline for almost two years, but most existing projects still do not use it. A small experiment in the CSS Property Type Validator generates a reviewable first draft of @property registrations from the custom properties you already have.
Flex Wrap Balance
I wished for this last year .flex-container { display : flex ; flex-wrap : balance ; } now it's headed to Chrome 🤘🏻
Just Submitted My State Of CSS 2026 Survey
Just submitted my State of CSS 2026 Survey.
Relative Alpha
Would use: CSS relative alpha . button { border-color : alpha(from hotpink / calc (alpha * .25) ); }