Schalk Neethling
@schalkneethling.com
Web Accessibility, Web Standards, and Ethical Source Evangelist. Destigmatising mental illness. Factorial.io
Pinned
Schalk Neethling
@schalkneethling.com
· Sep 17
My heart is shattered. This furry child filled my every day with so much joy. I do not know how I am going to cope without him.
Rest in peace beautiful boy - Kuiper
Rest in peace beautiful boy - Kuiper
Reposted by Schalk Neethling
comiCSS
comiCSS Games: games about CSS. Coded in CSS (mostly).
comicss.art
January 14, 2026 at 6:31 AM
Web dependencies are broken. Can we fix them? • Lea Verou | Dear JS ecosystem, I love you, but you have a dependency management problem when it comes to the Web, and the time has come for an intervention. | lea.verou.me/blog/2026/we... @lea.verou.me
Web dependencies are broken. Can we fix them? • Lea Verou
Dear JS ecosystem, I love you, but you have a dependency management problem when it comes to the Web, and the time has come for an intervention.
lea.verou.me
January 14, 2026 at 8:24 AM
Web dependencies are broken. Can we fix them? • Lea Verou | Dear JS ecosystem, I love you, but you have a dependency management problem when it comes to the Web, and the time has come for an intervention. | lea.verou.me/blog/2026/we... @lea.verou.me
Reposted by Schalk Neethling
Very yay for:
```
import stylesheet from "./style.css" with { type: "css" }
```
```
import stylesheet from "./style.css" with { type: "css" }
```
Firefox 147 just landed & it's pretty huge in terms of web features:
🎉 CSS anchor positioning
🎉 The navigation API
🎉 View transition types
🎉 Brotli support in Compression/DecompressionStream
🎉 CSS module imports
And more!
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/147
🎉 CSS anchor positioning
🎉 The navigation API
🎉 View transition types
🎉 Brotli support in Compression/DecompressionStream
🎉 CSS module imports
And more!
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/147
Firefox 147 release notes for developers (Beta) - Mozilla | MDN
This article provides information about the changes in Firefox 147 that affect developers.
Firefox 147 is the current Beta version of Firefox and ships on January 13, 2026.
developer.mozilla.org
January 13, 2026 at 4:08 PM
Very yay for:
```
import stylesheet from "./style.css" with { type: "css" }
```
```
import stylesheet from "./style.css" with { type: "css" }
```
Getting Started with CSS Anchor Positioning: anchor-name, position-anchor, and position-area | Discover how CSS anchor positioning brings native support for positioning e... | schalkneethling.com/posts/gettin...
Getting Started with CSS Anchor Positioning: anchor-name, position-anchor, and position-area
Discover how CSS anchor positioning brings native support for positioning elements relative to each other — no JavaScript required.
schalkneethling.com
January 13, 2026 at 7:24 AM
Getting Started with CSS Anchor Positioning: anchor-name, position-anchor, and position-area | Discover how CSS anchor positioning brings native support for positioning e... | schalkneethling.com/posts/gettin...
Reposted by Schalk Neethling
With Chrome 144, we now have "scroll-state(scrolled)," a container query that allows styling based on user scroll activity. Every time we replace JavaScript with pure CSS, it's a triumph.
una.im/scroll-stat...
una.im/scroll-stat...
una.im | Directional CSS with scroll-state(scrolled)
Style based on scroll direction with this new scroll-state query feature.
una.im
January 13, 2026 at 4:03 AM
With Chrome 144, we now have "scroll-state(scrolled)," a container query that allows styling based on user scroll activity. Every time we replace JavaScript with pure CSS, it's a triumph.
una.im/scroll-stat...
una.im/scroll-stat...
Reposted by Schalk Neethling
The number of redesigns with horizontal scrollbars on mobile devices recently is far too high. Come on people.
polypane.app/docs/horizon...
polypane.app/docs/horizon...
Horizontal overflow detection | Polypane
Polypane will automatically check panes for horizontal overflow issues and show an icon below a pane when it finds either
a horizontal…
polypane.app
January 13, 2026 at 6:44 AM
The number of redesigns with horizontal scrollbars on mobile devices recently is far too high. Come on people.
polypane.app/docs/horizon...
polypane.app/docs/horizon...
Reposted by Schalk Neethling
A fascinating look at how some common APIs really work. The speech synthesis one was a real eye-opener.
polypane.app/blog/not-all...
polypane.app/blog/not-all...
Not All Browser APIs Are "Web" APIs | Polypane
When we talk about "the web platform", we often treat it as a unified, standards-based system: browsers implement features from the same specifications, even if…
polypane.app
January 12, 2026 at 4:01 PM
A fascinating look at how some common APIs really work. The speech synthesis one was a real eye-opener.
polypane.app/blog/not-all...
polypane.app/blog/not-all...
One Tip a Week: Free Up 95GB on Your Mac | one-tip-a-week.beehiiv.com/p/one-tip-a-... - Thank you @nickyt.online 🙌 I have been looking for an alternative forever
One Tip a Week: Free Up 95GB on Your Mac
one-tip-a-week.beehiiv.com
January 12, 2026 at 4:21 PM
One Tip a Week: Free Up 95GB on Your Mac | one-tip-a-week.beehiiv.com/p/one-tip-a-... - Thank you @nickyt.online 🙌 I have been looking for an alternative forever
Responsive and Fluid Typography with Baseline CSS Features | As designers, it makes sense to think about what space is available in the browser, and adjust your typography accordingly. It's also important to remember that different use... | www.oddbird.net/2026/01/08/t...
Responsive and Fluid Typography with Baseline CSS Features
As designers, it makes sense to think about what space is available in the browser, and adjust your typography accordingly. It's also important to remember that different users will have different fon...
www.oddbird.net
January 9, 2026 at 6:43 PM
Responsive and Fluid Typography with Baseline CSS Features | As designers, it makes sense to think about what space is available in the browser, and adjust your typography accordingly. It's also important to remember that different use... | www.oddbird.net/2026/01/08/t...
Opening and Closing Dialogs Without JavaScript Using HTML Invoker Commands | Learn how to use HTML invoker commands to open and close dialogs without writing any JavaScript. | schalkneethling.com/posts/openin...
Opening and Closing Dialogs Without JavaScript Using HTML Invoker Commands
Learn how to use HTML invoker commands to open and close dialogs without writing any JavaScript.
schalkneethling.com
January 9, 2026 at 6:32 PM
Opening and Closing Dialogs Without JavaScript Using HTML Invoker Commands | Learn how to use HTML invoker commands to open and close dialogs without writing any JavaScript. | schalkneethling.com/posts/openin...
Reposted by Schalk Neethling
Everything is designed for single male developers in their twenties.
Ashlee’s example is actively doing harm but you also notice it in much smaller ways, like iPads not having multiple accounts. Because it’s impossible to imagine sharing one with your family and wanting to limit kids access.
Ashlee’s example is actively doing harm but you also notice it in much smaller ways, like iPads not having multiple accounts. Because it’s impossible to imagine sharing one with your family and wanting to limit kids access.
Pharmacy texts: call us we have a question!!!
Ok well I’m deaf so that’s hard. And now it’s not safe to drive bc I’m pretty sure I’m having withdrawal symptoms bc I ran out of the SNRI I need filled.
Nothing about these software systems seems designed for people in the way we need them
Ok well I’m deaf so that’s hard. And now it’s not safe to drive bc I’m pretty sure I’m having withdrawal symptoms bc I ran out of the SNRI I need filled.
Nothing about these software systems seems designed for people in the way we need them
January 9, 2026 at 6:51 AM
Everything is designed for single male developers in their twenties.
Ashlee’s example is actively doing harm but you also notice it in much smaller ways, like iPads not having multiple accounts. Because it’s impossible to imagine sharing one with your family and wanting to limit kids access.
Ashlee’s example is actively doing harm but you also notice it in much smaller ways, like iPads not having multiple accounts. Because it’s impossible to imagine sharing one with your family and wanting to limit kids access.
ReliCSS - Paste CSS code and click "Scan CSS" to analyse for hacks and get modernization suggestions. | www.alwaystwisted.com/relicss/
ReliCSS - Web Interface
www.alwaystwisted.com
January 8, 2026 at 8:55 AM
ReliCSS - Paste CSS code and click "Scan CSS" to analyse for hacks and get modernization suggestions. | www.alwaystwisted.com/relicss/
2025 JavaScript Rising Stars | A complete overview of the JavaScript landscape in 2025: trends about frontend, fullstack and Node.js frameworks, React and Vue.js ecosystems, build tools, state management... | risingstars.js.org/2025/en
2025 JavaScript Rising Stars
A complete overview of the JavaScript landscape in 2025: trends about frontend, fullstack and Node.js frameworks, React and Vue.js ecosystems, build tools, state management...
risingstars.js.org
January 8, 2026 at 8:54 AM
2025 JavaScript Rising Stars | A complete overview of the JavaScript landscape in 2025: trends about frontend, fullstack and Node.js frameworks, React and Vue.js ecosystems, build tools, state management... | risingstars.js.org/2025/en
Kagi Small Web - @kagi.com www.youtube.com/watch?v=af0O...
Kagi Small Web
YouTube video by Kagi
www.youtube.com
January 7, 2026 at 6:21 PM
Kagi Small Web - @kagi.com www.youtube.com/watch?v=af0O...
Text size in translation | Why translated text breaks your layout - YouTube www.youtube.com/watch?v=sgpZ...
Text size in translation | Why translated text breaks your layout
YouTube video by W3C
www.youtube.com
January 6, 2026 at 12:48 PM
Text size in translation | Why translated text breaks your layout - YouTube www.youtube.com/watch?v=sgpZ...
Web Standards for Policy Makers | lolaslab.co/standards-co... @lolaslab.bsky.social
Web Standards for Policy Makers
lolaslab.co
January 6, 2026 at 8:08 AM
Web Standards for Policy Makers | lolaslab.co/standards-co... @lolaslab.bsky.social
I shrunk down into an M5 chip - YouTube www.youtube.com/watch?v=Jh9p...
I shrunk down into an M5 chip
YouTube video by Marques Brownlee
www.youtube.com
January 1, 2026 at 4:37 PM
I shrunk down into an M5 chip - YouTube www.youtube.com/watch?v=Jh9p...
You're Storing Passwords Wrong. Here's The Fix - Encryption v Hash, Salt, bcrypt, Argon | www.youtube.com/watch?v=mQHi...
You're Storing Passwords Wrong. Here's The Fix
YouTube video by LearnThatStack
www.youtube.com
January 1, 2026 at 2:40 PM
You're Storing Passwords Wrong. Here's The Fix - Encryption v Hash, Salt, bcrypt, Argon | www.youtube.com/watch?v=mQHi...
DNS Explained - Stop Waiting 48 Hours for Changes www.youtube.com/watch?v=B96i...
DNS Explained - Stop Waiting 48 Hours for Changes
YouTube video by LearnThatStack
www.youtube.com
December 31, 2025 at 7:52 PM
DNS Explained - Stop Waiting 48 Hours for Changes www.youtube.com/watch?v=B96i...
Thinking of everyone with pets tonight 🤗
December 31, 2025 at 6:21 PM
Thinking of everyone with pets tonight 🤗
Millions of euros stolen in elaborate bank vault heist in Germany | This is straight out of a movie 🤯 🥷 www.youtube.com/watch?v=LZ_M...
Millions of euros stolen in elaborate bank vault heist in Germany | DW News
YouTube video by DW News
www.youtube.com
December 31, 2025 at 6:21 PM
Millions of euros stolen in elaborate bank vault heist in Germany | This is straight out of a movie 🤯 🥷 www.youtube.com/watch?v=LZ_M...
Homemade Balanced Raw Food for Dogs | www.youtube.com/watch?v=t1JY...
Homemade Balanced Raw Food for Dogs
YouTube video by Veterinary Secrets
www.youtube.com
December 31, 2025 at 7:36 AM
Homemade Balanced Raw Food for Dogs | www.youtube.com/watch?v=t1JY...
Reposted by Schalk Neethling
A rough prototype, but it's working! `[email protected]` now has a linter language! you can define "rule sheets" with a css-like syntax, then run them against your actual stylesheets and it'll lint your css in a split second!
Run `csskit tree` to see how to select nodes.
`npm i csskit@latest` ;)
Run `csskit tree` to see how to select nodes.
`npm i csskit@latest` ;)
![An editor window with the contents of a "Csskit Rule Sheet". The code reads:
/* check.cks */
:prefixed {
level: error;
diagnostic: "Avoid prefixed properties";
}
compound-selector:has(id) {
level: error;
diagnostic: "Avoid IDs in css selectors";
}
style-value[name=color]:not(:computed) {
level: error;
diagnostic: "Don't use literals in color style values, only our design tokens";
}
compound-selector:has(:nth-child(4)) {
level: warning;
diagnostic: "Complex selector, consider refactoring";
}](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:olwfcyixafqp6n4zbe2pskdj/bafkreiguoitftryfpkh2z7tzjn6okqretbe2splsnoccjl5evttetqejna@jpeg)
![A terminal window. The user has run the command `csskit check check.cks style.css` and the result is the following output:
× Avoid prefixed properties
╭─[test.css:3:2]
2 │ color: red;
3 │ -webkit-animation: spin 3s;
· ─────────────┬─────────────
· ╰── Avoid prefixed properties
4 │ }
╰────
× Avoid IDs in css selectors
╭─[test.css:1:1]
1 │ #a {
· ─┬
· ╰── Avoid IDs in css selectors
2 │ color: red;
╰────
× Don't use literals in color style values, only our design tokens
╭─[test.css:2:2]
1 │ #a {
2 │ color: red;
· ─────┬─────
· ╰── Don't use literals in color style values, only our design tokens
3 │ -webkit-animation: spin 3s;
╰────
⚠ Complex selector, consider refactoring
╭─[test.css:6:1]
5 │
6 │ div.b.c.d.e {
· ─────┬─────
· ╰── Complex selector, consider refactoring
7 │ color: var(--red-500);
╰────
Error: 1 files failed check!](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:olwfcyixafqp6n4zbe2pskdj/bafkreihrksmkq7c52rx2fw7wi32akyh6ytrq7frzfjnz6lqcak7fsphwp4@jpeg)
![A terminal window. The user has run `csskit tree style.css` and the result is the following output:
style-sheet
├─ style-rule:rule
│ ├─ selector-list:size(1)
│ │ ╰─ compound-selector
│ │ ╰─ id
│ ├─ style-value[name=color]:longhand
│ │ ╰─ style-value
│ │ ╰─ color-style-value
│ │ ╰─ color
│ ╰─ style-value[name=-webkit-animation]:unknown:prefixed
│ ╰─ style-value
╰─ style-rule:rule
├─ selector-list:size(1)
│ ╰─ compound-selector
│ ├─ tag
│ │ ╰─ html-tag
│ ├─ class
│ ├─ class
│ ├─ class
│ ╰─ class
╰─ style-value[name=color]:computed
╰─ style-value](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:olwfcyixafqp6n4zbe2pskdj/bafkreibxugtiuxqv6houicitlsndenuhysh3g5vg26juencofurm4tsyey@jpeg)
December 30, 2025 at 7:42 PM
A rough prototype, but it's working! `[email protected]` now has a linter language! you can define "rule sheets" with a css-like syntax, then run them against your actual stylesheets and it'll lint your css in a split second!
Run `csskit tree` to see how to select nodes.
`npm i csskit@latest` ;)
Run `csskit tree` to see how to select nodes.
`npm i csskit@latest` ;)
Does anyone have insights into why we have both of these?
<button popovertarget="popover" popovertargetaction="toggle" type="button">Show popover</button>
<button commandFor="popover" command="toggle-popover" type="button">Show popover (IC)</button>
The docs don't suggest a difference/preference.
<button popovertarget="popover" popovertargetaction="toggle" type="button">Show popover</button>
<button commandFor="popover" command="toggle-popover" type="button">Show popover (IC)</button>
The docs don't suggest a difference/preference.
December 30, 2025 at 10:51 AM
Does anyone have insights into why we have both of these?
<button popovertarget="popover" popovertargetaction="toggle" type="button">Show popover</button>
<button commandFor="popover" command="toggle-popover" type="button">Show popover (IC)</button>
The docs don't suggest a difference/preference.
<button popovertarget="popover" popovertargetaction="toggle" type="button">Show popover</button>
<button commandFor="popover" command="toggle-popover" type="button">Show popover (IC)</button>
The docs don't suggest a difference/preference.
One Tip a Week: git rerere | one-tip-a-week.beehiiv.com/p/one-tip-a-...
One Tip a Week: rerere
one-tip-a-week.beehiiv.com
December 29, 2025 at 6:47 PM
One Tip a Week: git rerere | one-tip-a-week.beehiiv.com/p/one-tip-a-...