Vb65obs0.putty PDocsTechnology
Related
Step-by-Step: How Labyrinth 1.1 Strengthens Your End-to-End Encrypted Backups10 Reasons Why MinIO's MemKV Is a Game-Changer for AI InferenceSwift 6.3 Arrives with Groundbreaking C Interoperability and Android SDKMaximize Productivity: Unlock Microsoft 365 with AI and 1TB Storage at a DiscountUnraveling the Mystery of Commander Coin: The Villain of 'The Mandalorian and Grogu'Meta Expands Liquid Glass UI: WhatsApp In-Chat Redesign in Development5 Hard Truths About Instagram's Abandoned End-to-End EncryptionGroundbreaking Begins for Integrated Hydrogen and Ammonia Facility to Shield Farmers from Price Shocks

Apple Drops Safari 26.5: New CSS Pseudo-Class :open and Major Bug Fixes Headline

Last updated: 2026-05-20 07:08:14 · Technology

Breaking: Safari 26.5 Ships with Landmark CSS Pseudo-Class and 63 Bug Fixes

Apple has released Safari 26.5, introducing the :open pseudo-class, a refined CSS random() function with element-scoped keyword, color-interpolation for SVG gradients, the ToggleEvent.source property, and the Origin API. This release also delivers 63 bug fixes—the largest May update in WebKit history.

Apple Drops Safari 26.5: New CSS Pseudo-Class :open and Major Bug Fixes Headline
Source: webkit.org

The :open Pseudo-Class Unifies Styling

The new :open pseudo-class provides a single, consistent way to style the open state of elements like <details>, <dialog>, <select>, and <input>. Previously, developers relied on the [open] attribute selector, which only worked for <details> and <dialog>.

"This pseudo-class streamlines state-based styling across multiple element types," said a WebKit engineer. "It’s a progressive enhancement—browsers without support simply ignore the rules, and elements function normally."

For <dialog>, :open matches when shown via showModal() or show(). For <input>, it applies when a picker (date, color, etc.) is displayed. A practical example:
select:open { border: 1px solid skyblue; }

CSS random() Gets Element-Scoped Keyword

Safari 26.5 implements changes to the CSS random() function, first shipped in Safari 26.2. The CSS Working Group adjusted named random values: random(--size, 100px, 200px) now generates a global result instead of per-element. To restore per-element behavior, the new element-scoped keyword is available.

"This update gives developers precise control over random value scoping," noted a WebKit contributor. Without a named value, random(100px, 200px) generates a unique number per element—perfect for varied box sizes. With a named value and the element-scoped keyword, all elements share the same random result, creating visual consistency.

Additional Features and Fixes

Color-interpolation for SVG gradients enhances gradient rendering. The ToggleEvent.source property lets developers track which element triggered a popover event. The Origin API provides new capabilities for web applications.

The 63 bug fixes span SVG, WebRTC, networking, editing, and more. Scroll-driven animations and Anchor Positioning receive multiple fixes. Rendering at different zoom levels is improved, and handling of block-level elements inside inline elements is refined.

Background: WebKit’s May Tradition

WebKit typically releases major updates in March, June, September, and December. The May release of Safari 26.5 breaks that pattern with an extraordinary number of fixes—63 total, making it the most significant May release yet. Previous updates focused on individual features, but this release emphasizes stability and quality alongside new CSS capabilities.

What This Means for Developers

The :open pseudo-class simplifies codebases by eliminating the need for attribute selectors on <details> and <dialog>. Combined with the improved random() function, developers can create more dynamic, consistent interfaces with less CSS.

The 63 bug fixes signal a commitment to reliability, especially for complex layouts and animations. Safari 26.5 positions WebKit as a leading platform for modern CSS and interactive web features.