Safari Technology Preview 215 is here! It includes several exciting features: - Scroll Driven Animations - text-wrap-style: pretty - CSS Anchor Positioning - HDR images - Trusted Types - File System WritableStream API
Styling HTML form controls is something web designers & developers have wanted for years! My team is working on a solution — you’ll apply `appearance: base` and switch to a new interoperable, consistent controls with easy to override default CSS. They inherit much more of what you already have going on. And then you can override (even more of) those styles using new pseudo-elements. See the details at:
We heard your requests! Responsive Design Mode in Safari 18.4 beta now has a dropdown of preset viewport sizes available. Along with a button to switch orientation. image
Interop 2024 reached an all time high interoperability score! Every browser tested earned a 99 while overall interoperability reached 97% pass rate (in preview browsers). Read more about the success of Interop 2024:
Safari 18.2 is here! For web developers, it’s the biggest release of new features this year. Highlights include cross-document View Transitions, text-box, spatial videos in visionOS, ruby improvements, WASM garbage collection, HTTPS by default, Genmoji, and more. image
I’m excited about what we have coming in Safari 18.2 for web designers and developers. - `text-box-edge`, `text-box-trim`, and `text-box` - cross-document View Transitions, View Transition Classes, View Transition Types, `view-transition-name: auto` - dividing by numbers with units in `calc()` - `background-clip: border-area` - `scrollbar-width` and `scrollbar-gutter` - ruby-align, ruby-overhang, unprefixed `ruby-position` - `input type=week` on iOS And a LOT more!
This article by @Ahmad Shadeed is fantastic. It explores the choice of adding masonry-layout capabilities to CSS Grid vs creating a whole new display type. He created several examples, going through the code needed to create layout variations at breakpoints while still supporting older browsers. What would it be like to use each in the real world? A highly recommended read! image
This week is the WebKit Contributor’s meeting — with the browser engineers who contribute to WebKit. Including from Apple, Igalia, Sony, Redhat & more. Did you know that WebKit is not just the browser engine for Safari — but for many other browsers, apps, and platforms as well? Igalia @npub12wy5...lm9d maintains two of them: WebKitGTK @WebKitGTK and WPE @WPE WebKit WebKit is especially great for devices that don’t have a lot of power. It’s used for digital signs, medical devices, game consoles and more!
I’m really proud of this article on Masonry & CSS. It was incredibly hard to write. We spent weeks writing and rewriting, digging deeper & deeper into the issues at had, working to make things as easy to understand as possible. There’s also a really cool idea about how to add another new feature to CSS Grid. (It would make it super easy to create a common article layout that’s not easy today.) I can’t wait to hear what you think. image
Would you like to be able to create masonry-style layouts in CSS??? We just wrote a giant article with all the latest news on where this feature is at. The CSSWG is now debating how the syntax should work. Please read our thoughts, and chime in with yours (read to the end of the article to learn how).