This is not an article that Steve, the author, thinks should exist in a healthy industry, but the shape of our industry — especially right now — makes this sort of article very necessary and hopefully helpful to you in your job.
piccalil.li/blog/applyin...
div { border: 20px solid transparent; padding: 20px; background: linear-gradient(in oklch, cyan, lime) content-box, conic-gradient(deeppink 0 0) padding-box, linear-gradient(to top in oklch, cyan, lime) border-box; }
a box filled in 3 different way as described in the post
#CSS trick not enough folks know about:
painting into the sub boxes of an element
- border
- padding
- content
you can paint into one, or all of them differently!
here's a gradient border, a solid padding fill, and a gradient content (inner) box
see fur yerself
codepen.io/argyleink/pe...
New in Chromium 148: detect at-rule support in CSS with `@supports at-rule(@keyword)`
www.bram.us/2026/03/15/a...
Chrome 148 is currently available on the Canary and Dev release channels. It goes stable at the end of April.
Abstract illustration of a CSS animation in the shape of a series of square that get incresingly rotated. The text reads: CSS animations as state machines.
I feel like this is either very dumb or very clever. Either way, I blogged about it:
Using CSS animations as state machines to remember focus or hover states in CSS only.
patrickbrosset.com/articles/202...
After watching youtu.be/XVIgKEOVfVg, where @matuzo.at talks about the new HTML text-scale meta tag, I had to revise my »Breakpoints« article from last week.
Check out “Clashes between web and X11 colors in the CSS color scheme” under en.wikipedia.org/wiki/X11_col...
The color “gray” in CSS is actually darker than than the color “darkgray”.
There’s a typo on the body element, namely `bacgkround: gray;`, but the tragedy is real.
✍️ I usually write about HTML, CSS and JS. Doing a bit about git feels alien to me. Primarily I put it out there to attract crowd wisdom.
cssence.com/2026/rebase-...
#git
✍️ Part Two of my miniseries about edge cases in web design:
Will all the resources on your site finish loading?
Only at the best of times.
cssence.com/2026/breakin...
#WebDev #WebDesign
Modern #CSS code snippets, side by side with the old hacks they replace.
Long Distance High Five! 🙂
Seconds after I posted my latest article I ran into this gem from @dbushell.com, so I‘m gonna to link to it:
dbushell.com/2025/06/13/y...
Throwing such an error message towards your visitors violates my “Fail gracefully” bullet point.
✍️ Part Two of my miniseries about edge cases in web design:
Will all the resources on your site finish loading?
Only at the best of times.
cssence.com/2026/breakin...
#WebDev #WebDesign
First order of business: Read »Continvoucly Morged Value« by @matthiasott.com
> The care is the work.
>
> The care creates the value.
>
> AI doesn’t care. AI is just another tool.
matthiasott.com/notes/contin...
Wow, that’s tiny. Thanks for the tip.
Part One of my miniseries about edge cases in web design:
What is the agreed-upon minimum resolution? 320px, 360px?
It’s complicated.
cssence.com/2026/breakpo...
#CSS #WebDesign
corner-shape is one of those things where when you first see it, it's like "oh cool, I can make a scoop!" It's something new, which is fun, but it can be hard to think of good use cases.
But, as @cassidoo.co looks at here, it's going to open up a lot of possibilities 🙂 cassidoo.co/post/css-cor...
Graphic with Chrome for Developers branding, a location permission dialog saying “permission.site wants to Know your location,” buttons “Allow while visiting the site” and “Allow this time,” and text “Introducing the HTML element” with a “Use location” button.
Introducing the <geolocation> HTML element. Chrome 144 adds a declarative, click-to-share location control that reduces boilerplate and improves user intent signals, with origin trials showing fewer capture errors, better user flows, and recovery. #html #api
developer.chrome.com/blog/geoloca...
You know that annoying experience on mobile websites where you need to find the little close button and can't swipe a menu closed?
The solution is simpler than you think.
With basic CSS scroll APIs, you can get built-in interruptible swipe gestures 🥳
What a week! With the release of Firefox 147 Anchor Positioning became Baseline Newly Available, and thanks to @matuzo.at I learned that popovers have an implicit anchor. Sweet!
matuzo.at/blog/2026/be...
#CSS
If you don’t care about text-based web browsers (I can’t blame you), this article doubles as a list of all the cool stuff that got added to HTML.
Oof! That rabbit hole wasn’t even on my radar.
It’s 2026 and text-based web browsers still do not know how to handle (not so) recent additions to HTML.
cssence.com/2026/text-ba...
#HTML #WebDev
Fully agree.
> Nevertheless, CSS is awesome.
—https://cssence.com/2024/hyphenation/
Agreed.
I just looked at caniuse, this is sadly still `display: float` territory.
cssence.com/2023/drop-ca...
Having read cloudfour.com/thinks/justi... by @tylersticka.com et al., I learned about `hyphenate-limit-chars`, and in a nanosecond it jumped to the top of my list of #CSS properties that I’d like to see full support across browsers.
(Sure, it can be progressively enhanced, but still.)
Me: Style queries are a game changer!
Also me: caniuse.com/css-containe...
#CSS
I needed to get this off my chest.
Are you doing web accessiblity work too? Can you relate? Did you blog about something similar? Let me know.
#WevDevelopment #A11Y
