@pawelgrzybek I’m using Feedly in the browser (pinned tab) in combination with their mobile apps for when I’m on the go.

@chriscoyier So, the piercing is expected, as those pseudos are technically still inline.

The odd thing is, though, that they _behave_ like block elements due to their UA styling (the `position: absolute`).

We have opened a CSS WG issue to explicitly make them `display: block` by default (through the UA stylesheet) to prevent surprises like this.

https://github.com/w3c/csswg-drafts/issues/13373

Wild how far you can push "customizable select" with just #CSS

https://nerdy.dev/nice-select

@chriscoyier The fix to apply is this:

```
::view-transition-new(*),
::view-transition-old(*) {
display: block;
}
```

I’m still checking with engingeering as it surprised me that the `text-align` (which only has effect on inline things) pierces through all those intermediary abspos pseudos.

@chriscoyier Digging in, I see that it also happens in a VanillaJS version [^1] and that it’s happening in all browsers.

I’m pinging engineering **now** to ask what’s up.

(And I’ll happily try out the beta 😉)

[^1] https://codepen.io/bramus/pen/XJKYmRj/b191a3b108fa0c453d80d3253a4135dd

@chriscoyier Got a link?

@rickdoesburg Ah, ik had een selector verkeerd, waardoor de animation-timeline niet op de h2 toegepast werd. Bij deze opgelost :)

The @csswg needs your input!

We just resolved to support multiple borders and outlines per element, comma separated! 🎉

But we can’t decide on the order: inside out or outside in?
What feels more natural to you, A or B?

Poll in https://front-end.social/@leaverou/115974948169271135

@rickdoesburg Hmmz, daar loopt precies iets mis idd … ik check.

@vasilis @johannes @kizu UPDATE: The CSSWG resolved just now to have steps() accept an optional easing function.

So Vasilis’s https://vasilis.nl/clocks/station-clock/01/ clock would become as easy as `animation: ticking 60s steps(60, ease)`.

https://github.com/w3c/csswg-drafts/issues/11970#issuecomment-3813211484

@tomayac I needed this for https://github.com/bramus/view-transitions-js (for the “React to a Promise” part of the spec), and the code seemed worthy enough to split off into its own package 😊

🌟 Vertical Tabs are available behind a flag in Chrome 145 (current beta)

1. Go to `chrome://flags/#vertical-tabs`
2. Set it to enabled
3. Relaunch Chrome
4. Right click the tabbar and choose “Move Tabs To The Side”

Attached are before and after screenshots.

@anthonyvdg This is a userland implementation. Nothing official about this.

Typically one won't ever need this, but when implementing things that need to "react to a promise" (https://webidl.spec.whatwg.org/#dfn-perform-steps-once-promise-is-settled), this comes in handy.

I wrote a thing: `WatchablePromise`, a Promise whose status (pending, fulfilled, reject) and settled state (true or false) you can read.

https://github.com/bramus/watchable-promise

Create a new WatchablePromise instance, or make an existing Promise watchable using `WatchablePromise.from(promise)`.

RE: https://mastodon.social/@firefoxwebdevs/115899080948904965

I’ve said it before and I’ll say it again: this API is so good! 🤤

📣 PSA: In Chrome 145 or newer, using `100vw` no longer causes horizontal overflow when the vertical scrollbar is guaranteed to be visible or if space for it is reserved.

See https://www.bram.us/2026/01/15/100vw-horizontal-overflow-no-more/ for details.

RE: https://mastodon.world/@heypresents/115894519172920695

Come see me speak at All Day Hey! 2026 on May 7 later this year, where I will be bending the View Transition API in all sorts of unconventional ways.

https://heypresents.com/conferences/2026

@firefoxwebdevs
Want to learn more about #CSSAnchorPositioning
@bramus
is speaking about it at #SotB26
#InPerson & #Online tickets still available:
https://2026.stateofthebrowser.com/speaker/bramus-van-damme/

📢 New blog post: A polyfill for the HTML switch element:
https://blog.tomayac.com/2026/01/12/a-polyfill-for-the-html-switch-element/.

Safari 17.4 shipped a new HTML switch element that upgrades a checkbox to a switch by adding a `switch` attribute: `<input type="checkbox" switch>`.

This blog post introduces a polyfill for the element, covering accessibility, internationalization and styling, and looking at the element's status in the HTML spec.

@Lukew @sil @bkardell @dletorey @owa If only they respected viewport-fit=cover in portrait mode (they do in landscape) …

(I've passed on this info before, even multiple times, but to no avail 😕)