Web/API/CSS/supports

From Get docs
< Web/API‎ | CSS


The CSS.supports() method returns a Boolean value indicating if the browser supports a given CSS feature, or not.

Syntax

CSS.supports(propertyName, value);
CSS.supports(supportCondition);

Parameters

There are two distinct sets of parameters. The first one allows to test the support of a pair property-value:

propertyName
A DOMString containing the name of the CSS property to check.
value
A DOMString containing the value of the CSS property to check.

The second syntax takes one parameter matching the condition of @supports:

supportCondition
A DOMString containing the condition to check.

Return value

true if the browser supports the rule, otherwise false.

Examples

result = CSS.supports("text-decoration-style", "blink");
result = CSS.supports("display: flex");
result = CSS.supports("(--foo: red)");

result = CSS.supports(`(transform-style: preserve) or (-moz-transform-style: preserve) or
                       (-o-transform-style: preserve) or (-webkit-transform-style: preserve)`);

// result is true or false

Specification

Specification Status Comment
CSS Conditional Rules Module Level 3The definition of 'CSS: supports()' in that specification. Candidate Recommendation Initial definition.

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
supports

Chrome Full support 61


Full support 61


Partial support 28

Notes'

Notes' Version 60 or older didn't support parentheses-less one-argument version.

Edge Partial support 12

Notes'

Partial support 12

Notes'

Notes' Edge doesn't support parentheses-less one-argument version.

Firefox Full support 55


Full support 55


Partial support 22

Notes'

Notes' Version 54 or older didn't support parentheses-less one-argument version. Partial support 20

Disabled'

Disabled' From version 20: this feature is behind the layout.css.supports-rule.enabled preference. To change preferences in Firefox, visit about:config.

IE

No support No

Opera

Full support 12.1

Safari

Full support 10

WebView Android Full support 61


Full support 61


Partial support 37

Notes'

Notes' Version 60 or older didn't support parentheses-less one-argument version.

Chrome Android Full support 61


Full support 61


Partial support 28

Notes'

Notes' Version 60 or older didn't support parentheses-less one-argument version.

Firefox Android Full support 55


Full support 55


Partial support 22

Notes'

Notes' Version 54 or older didn't support parentheses-less one-argument version. Partial support 20

Disabled'

Disabled' From version 20: this feature is behind the layout.css.supports-rule.enabled preference. To change preferences in Firefox, visit about:config.

Opera Android

Full support 12.1

Safari iOS

Full support Yes

Samsung Internet Android Full support 8.0


Full support 8.0


Partial support 1.5

Notes'

Notes' Samsung Internet 8.0 or older didn't support parentheses-less one-argument version.

Legend

Full support  
Full support
Partial support  
Partial support
No support  
No support
See implementation notes.'
See implementation notes.
User must explicitly enable this feature.'
User must explicitly enable this feature.


See also