March 2024 web platform update
Now widely available on the web platform
Widely available
-
aspect-ratio: The
aspect-ratio
CSS property controls the width-to-height ratio of elements. For<img>
and<video>
elements, thewidth
andheight
attributes used together withheight: auto
control the aspect ratio while the image/video is loading. Learn more.
Newly available on the web platform
Newly available
-
AbortSignal.any(): The
AbortSignal.any()
static method combines an iterable of abort signals into a single signal, with the abort reason taken from the first signal to abort. Learn more. -
Array grouping: The
Object.groupBy()
andMap.groupBy()
static methods group values of arrays and iterables based on a function that returns a key for each value. Learn more. -
checkVisibility(): The
checkVisibility()
method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the styledisplay: none
, but can also check forvisibility: hidden
. Learn more. -
Promise.withResolvers(): The
Promise.withResolvers()
static method is an alternative to thePromise()
constructor that returns both the promise and resolution functions. You can use this to accessresolve
andreject
outside the scope of the executor function. Learn more. -
text-wrap: nowrap: The
text-wrap: nowrap
CSS declaration prevents text breaking into multiple lines. Text that doesn't fit overflows instead. Learn more. -
Transferable ArrayBuffer: The
transfer()
andtransferToFixedLength()
methods ofArrayBuffer
move a buffer from one context to another (for example, to a worker). Learn more.
Now available in Chrome
Limited availability
-
CSS import attributes: Module `import ... with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts and formerly known as import assertions. Learn more.
-
field-sizing: The
field-sizing
CSS property allows form controls such as<textarea>
to be sized based on their content. Learn more. -
JSON import attributes: Module
import ... with { type: "json" }
statements load JSON data. Also known as JSON module scripts and formerly known as import assertions. Learn more. -
light-dark(): The
light-dark()
CSS function accepts two colors and uses one depending on the current color scheme. Learn more. -
text-spacing-trim: The
text-spacing-trim
CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters. Learn more.
Now available in Chrome Android
Limited availability
-
CSS import attributes: Module `import ... with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts and formerly known as import assertions. Learn more.
-
field-sizing: The
field-sizing
CSS property allows form controls such as<textarea>
to be sized based on their content. Learn more. -
JSON import attributes: Module
import ... with { type: "json" }
statements load JSON data. Also known as JSON module scripts and formerly known as import assertions. Learn more. -
light-dark(): The
light-dark()
CSS function accepts two colors and uses one depending on the current color scheme. Learn more. -
text-spacing-trim: The
text-spacing-trim
CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters. Learn more.
Now available in Edge
Limited availability
-
CSS import attributes: Module `import ... with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts and formerly known as import assertions. Learn more.
-
field-sizing: The
field-sizing
CSS property allows form controls such as<textarea>
to be sized based on their content. Learn more. -
JSON import attributes: Module
import ... with { type: "json" }
statements load JSON data. Also known as JSON module scripts and formerly known as import assertions. Learn more. -
light-dark(): The
light-dark()
CSS function accepts two colors and uses one depending on the current color scheme. Learn more. -
text-spacing-trim: The
text-spacing-trim
CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters. Learn more.
Now available in Safari
Limited availability
-
Unsanitized HTML parsing methods: The
Document.parseHTMLUnsafe()
static method parses HTML into a DOM tree, while thesetHTMLUnsafe()
method ofElement
andShadowRoot
parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings. Learn more. -
@scope: The
@scope
CSS at-rule sets the scope for a group of rules. Learn more. -
showPicker() for <input>: The
showPicker()
method for<input>
elements shows the user interface for picking a value. For example, for<input type="date">
it shows the interface for picking a date. Learn more. -
::spelling-error and ::grammar-error: The
::spelling-error
and::grammar-error
CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively. Learn more. -
transition-behavior: The
transition-behavior: allow-discrete
CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%. Learn more.
Now available in Safari on iOS
Limited availability
-
Unsanitized HTML parsing methods: The
Document.parseHTMLUnsafe()
static method parses HTML into a DOM tree, while thesetHTMLUnsafe()
method ofElement
andShadowRoot
parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings. Learn more. -
@scope: The
@scope
CSS at-rule sets the scope for a group of rules. Learn more. -
::spelling-error and ::grammar-error: The
::spelling-error
and::grammar-error
CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively. Learn more. -
transition-behavior: The
transition-behavior: allow-discrete
CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%. Learn more.