Discover some of the interesting features that have landed in stable and beta web browsers during November 2023.
Stable browser releases
In November 2023, we only had one stable browser release with Firefox 120. This post looks at what that means for the web platform.
Support for the media
attribute in the <source>
element
Firefox reintroduces support for the media
attribute in the <source>
element. The support is expanded to include the <audio>
and <video>
elements. With this release, the media attribute will be available in <source>
elements within <audio>
, <video>
, and <picture>
.
Support for the media
attribute is coming to Chrome, and is already in Safari, so you will soon have support for responsive HTML video and audio across all engines.
The CSS Color light-dark()
function
Firefox now supports the light-dark()
CSS Color function. This means that you can set colors for light and dark schemes without using the prefers-color-scheme
media feature.
The lh
and rlh
units
Firefox supports the CSS units lh
and rlh
These units allow you to set values relative to the line-height of an element,
this is useful when you want to align background images with text.
This release makes these unts interoperable across all three major engines.
Browser Support
HTTP 103 Early Hints
Firefox now supports the 103 Early Hints HTTP information response status code.
Beta browser releases
Beta browser versions give you a preview of things that will be in the next stable version of the browser. It's a great time to test new features, or removals, that could impact your site before the world gets that release. New betas are Firefox 121, Chrome 120, and Safari 17.2. These releases bring many great features to the platform. Check out the release notes for all of the details. Here are just a few highlights.
Chrome 120 and Safari 17.2 include relaxed parsing for CSS Nesting.
Chrome 120 unprefixes the -webkit-mask*
properties and brings them into line with the current specification. This includes mask-image
, mask-mode
, mask-repeat
, mask-position
, mask-clip
, mask-origin
, mask-size
, and mask-composite
, as well as the mask
shorthand. Local mask-image
references are supported, serialization now matches the specification, and accepted values now match the specification.
Chrome 120 and Safari 17.2 include support for the name
attribute for the
<details>
element.
Firefox 121 includes the CSS :has()
selector. This release makes :has()
interoperable across all major engines.
Part of the New to the web series