BASELINE NowYouCanUse.com
Web Platform Baseline Status Breakdown Total Features: 1219
Search:
Categories: All CSS (102) HTML elements (100) Selectors (46) JavaScript (43) Forms (42)
WebGL extensions (37) Text (26) WebAssembly (22) Media queries (21) Scrolling (20) Fonts (19) Performance (19) Arrays (17) Layout (17) HTML (16) Progressive web app (15) Typed arrays (14) Units (14) Canvas (13) Color types (13) Strings (13) Background (12) Media elements (12) Security (12) Animation (11) Clipping, shapes, and masking (11) Web components (11) WebXR (11) Typographic font features (10) DOM (9) Internationalization (9) Iterators (9) Reporting (9) Text wrap (9) Workers (9) Clipboard (8) CSS object models (7) Containment (7) Fetch (7) JavaScript modules (7) Print media (7) Sensors (7) Container queries (6) Explicit defaults (6) Image formats (6) Landmark elements (6) Multi-column (6) Positioning (6) Promises (6) SVG (6) Storage (6) Streams (6) Credential management (5) Custom elements (5) Font synthesis (5) HTTP (5) Lists (5) Messaging (5) Resource hints (5) Ruby (5) Selection (5) Speech (5) Transitions (CSS) (5) View transitions (5) Web audio (5) WebGL (5) Anchor positioning (4) Cookies (4) Counters (4) File system access (4) Flexbox (4) Gamepad (4) Grid (4) Images (4) Primitive types (4) Regular expressions (4) WebDriver (4) WebRTC (4) Blend mode (3) Borders and outlines (3) Geolocation (3) Gradients (3) Image scaling (3) JSON (3) Maps (3) MathML (3) Payments (3) Reading order (3) Scroll markers (3) Transforms (3) WebAuthn (3) WebGPU (3) White space (3) Worklets (3) XML (3) Collections (2) Compute pressure (2) IndexedDB (2) Parsing and serialization (2) Resource integrity (2) Sets (2) Text fragments (2) WebMCP (2) CSS environment variables (1)
Showing 30 of 102 features

2015

7 features
• July 2015
Widely Available

The text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.

Chrome 1
Firefox 7
Safari 1.3
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The physical CSS properties, top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The opacity CSS property sets the transparency of an element.

Chrome 1
Firefox 1
Safari 2
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.

Chrome 1
Firefox 3
Safari 1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The @import CSS at-rule loads styles from another stylesheet.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).

Chrome 26
Firefox 16
Safari 7
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015

Limited Availability

23 features
• In Progress / Not Yet Baseline
Limited

The random() CSS function chooses a random numeric value within a specified range. This allows for dynamic, randomized styling using CSS.

Chrome 156
Firefox —
Safari 26.2
Edge —
Status: Incomplete cross-engine support
Limited

The at-rule() function, when used with @supports, checks if a CSS at-rule is supported. For example @supports at-rule(@starting-style) checks if the @starting-style at-rule is supported.

Chrome 148
Firefox 157
Safari —
Edge 148
Status: Incomplete cross-engine support
Limited

The attr() CSS function, in the context of any property, returns the value of an attribute of an HTML element, with the option to return it as a specific type or unit. You can set a default value for missing or invalid attributes.

Chrome 133
Firefox 155
Safari —
Edge 133
Status: Incomplete cross-engine support
Limited

The window-drag: move CSS declaration sets an element as a window drag handle, like a device's app title bar. You can use this to add click-and-drag areas to an installed progressive web app, often alongside window controls overlay.

Chrome 152
Firefox —
Safari —
Edge 152
Status: Incomplete cross-engine support

The named-feature() function, when used with @supports, checks if a named CSS behavior is supported. The CSS behavior names are defined by specification. For example, @supports named-feature(anchor-position-follows-transforms) checks whether anchor-positioning applies after transforms."

Chrome 150
Firefox —
Safari —
Edge 150
Status: Incomplete cross-engine support

The overflow-clip-margin CSS property sets how far overflow content may appear outside the bounds of an element before it's clipped by effects such as overflow: clip.

Chrome —
Firefox 148
Safari —
Edge —
Status: Incomplete cross-engine support
Limited

The accent-color CSS property sets a color for checkboxes, radio buttons, and other form controls.

Chrome 93
Firefox 92
Safari 26.2
Edge 93
Status: Incomplete cross-engine support
Limited

The @function CSS at-rule defines a custom function that takes CSS values or custom properties as arguments, and returns a CSS value. It can be based on conditional logic such as by using the @media at-rule.

Chrome 139
Firefox —
Safari —
Edge 139
Status: Incomplete cross-engine support
Limited

The if() CSS function is an inline conditional value that returns a value based on a set of conditions.

Chrome 137
Firefox —
Safari —
Edge 137
Status: Incomplete cross-engine support
Limited

The reading-flow CSS property sets the order in which flex or grid elements are rendered to speech or reached via focus navigation. The reading-order property overrides this order.

Chrome 137
Firefox —
Safari —
Edge 137
Status: Incomplete cross-engine support

The dynamic-range-limit CSS property controls the peak luminance of high dynamic range content. You can use this to coordinate the apparent brightness of HDR and SDR content.

Chrome 136
Firefox —
Safari —
Edge 136
Status: Incomplete cross-engine support
Limited

The calc-size() CSS function computes mathematical expressions that include height and width keyword values, for example calc-size(fit-content, size / 2). Not to be confused with the calc() CSS function, which cannot use keyword values.

Chrome 129
Firefox —
Safari —
Edge 129
Status: Incomplete cross-engine support

You can animate elements between display: none and any other display value or animate between content-visibility: hidden and any other content-visibility value. This also applies to transitions.

Chrome 117
Firefox —
Safari 18
Edge 117
Status: Incomplete cross-engine support

The text-spacing-trim CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters.

Chrome 123
Firefox —
Safari —
Edge 123
Status: Incomplete cross-engine support
Limited

The overlay CSS property, used as an allow-discrete CSS transition, prevents a top layer element, such as a popover or a <dialog>, from being removed from the top layer before it has finished animating. You can't set the value of the overlay property; only use it as transition property.

Chrome 117
Firefox —
Safari —
Edge 117
Status: Incomplete cross-engine support

The overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.

Chrome 114
Firefox 112
Safari 12
Edge 114
Status: Incomplete cross-engine support
Limited

The margin-trim CSS property removes the margins of child elements when they meet the edges of the container.

Chrome —
Firefox —
Safari 16.4
Edge —
Status: Incomplete cross-engine support

The initial-letter CSS property sets the number of lines the first letter of an element occupies. You can use the property to make a raised capital or drop cap.

Chrome 110
Firefox —
Safari —
Edge 110
Status: Incomplete cross-engine support

The object-view-box CSS property crops and zooms to an inset area of an image.

Chrome 104
Firefox —
Safari —
Edge 104
Status: Incomplete cross-engine support
Limited

The cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.

Chrome 68
Firefox 27
Safari 11
Edge 79
Status: Incomplete cross-engine support
Limited

The display: ruby CSS declaration renders an element with the box layout of a <ruby> HTML element. Child elements may use equivalents to <ruby> internal elements such as display: ruby-base for <rb>.

Chrome —
Firefox 88
Safari —
Edge —
Status: Incomplete cross-engine support
Limited

The user-select CSS property controls which elements can be selected by the user.

Chrome 54
Firefox 69
Safari —
Edge 79
Status: Incomplete cross-engine support

The resize CSS property sets whether an element can be resized by the user, and on which axes.

Chrome 4
Firefox 5
Safari 4
Edge 79
Status: Incomplete cross-engine support
← Previous Page 3 of 4 (102 features) Next →