Browser releases

Safari Technology Preview 247 lands calc-mix() and clears a scatter of small fixes

Safari Technology Preview 247 lands calc-mix() and clears a scatter of small fixes

I opened the STP 247 notes on my lunch break and there is one headline, plus a scatter of small fixes that a lot of readers will feel without ever reading a changelog. The headline is CSS calc-mix() landing in WebKit's preview channel. The scatter is a couple of HTML spec-alignment repairs, two accessibility fixes, and a MathML tweak.

This is Safari Technology Preview 247, dated July 1, 2026, covering WebKit changes between 314716@main and 315846@main. It is a preview build, not a stable Safari release, so treat everything here as engine-specific behaviour you can experiment with today rather than something to ship broadly tomorrow.

The one CSS line worth pinning

The release lists "Added support for calc-mix()" under CSS → New Features, and that is the whole entry. No syntax example, no follow-up prose. So the useful thing I can say from the notes alone is that WebKit's preview engine now knows the function name. That is the point where a hand-authored stylesheet can start feature-detecting it in this build and dropping it into a scratch page.

Because the release does not spell out the syntax, I am not going to paste one here. Read the linked spec text before you write more than a scratch rule against it, and gate anything real behind an @supports block until you know what other engines have.

Two small HTML repairs

Below the CSS entry, two lines caught me because they are exactly the flavour of thing that lingers for years and then gets quietly corrected.

The first: the deprecated align="center" attribute was not being treated as identical to align="middle" per spec, and STP 247 fixes that. If you maintain old markup (or the output of a legacy tool that emits either spelling), the two now behave the same way in this engine.

The second: <link rel=preload as=json> was incorrectly triggering a preload, and no longer does. A preload with an unsupported as value should be inert. That is now the case here. It is the sort of correction whose signal only shows up in a network waterfall, but it removes a phantom request that some pages were paying for by accident.

The accessibility pair

Two items in the Accessibility section, and both are worth reading twice.

VoiceOver was not exposing aria-actions custom actions when the action target was accessibility-ignored. If you had wired custom actions to a node that assistive tech was skipping, the action list went quiet. Per the release, that is fixed.

The second one I would flag to any web developer: an <a> element with a click handler but no href was not being exposed as a link. STP 247 corrects that, so such anchors now surface as links in this engine. That matches how the platform is supposed to model an interactive anchor, and it is a small nudge back toward the older advice: if a thing behaves like a link, give it an href so the whole stack, assistive tech included, can treat it like one. The engine's new behaviour here is a repair, not a licence.

One line for MathML watchers

Under MathML → New Features, the build adds support for embellished operator detection through mrow for underover layout. That is the entire entry. Its audience is MathML authors and tooling: the layout of an underover construct will now look through an mrow wrapper when working out whether the operator inside it is embellished.

What I am watching next

STP 247 is a single-engine preview. The notes make no Baseline claim on any of this, and neither do I. The next question with calc-mix() is when and where the other engines start acknowledging it, because the value of a CSS value-mixing function is proportional to how many places you can rely on it. Until then, feature-detect, test in this build, and hold off on shipping anything that depends on it to a broad audience.

Source: WebKit Blog (webkit.org)

Related
Browser releases

Safari 27 beta opens up the form control, scroll, and the cascade

WebKit has detailed the Safari 27 beta: 58 new web-platform features and 525 fixes, including customizable <select>, scroll anchoring, the :heading pseudo-class, and the revert-rule and stretch CSS keywords.

June 19, 2026
Browser releases

Safari Technology Preview 246 widens color, images and attr()

WebKit has shipped Safari Technology Preview 246 with a batch of CSS additions — light-dark() taking image values, image(<color>), alpha(), color-mix() with more than two colors, attr() on pseudo-elements, and preview support for font-variant-emoji and word-break: auto-phrase.

June 23, 2026
CSS & layout

Grid Lanes gets a Field Guide — and a fourth layout primitive to argue about

WebKit has published gridlanes.webkit.org, a Field Guide for the new display: grid-lanes layout primitive, with a playground, a cheat sheet and six demos pitting Grid Lanes against Flexbox, Multicolumn and Grid.

June 22, 2026