CSS object modelBaseline · Widely available
The CSS object model API reads, creates, and modifies CSS stylesheets and inline styles. Also known as CSSOM.
Supported in all major browsers for at least 30 months — safe to use without fallbacks. Baseline since Sep 30, 2015. Widely available since Mar 30, 2018.
Browser support
DesktopChrome
1–27Not supported
28+Supportedsince Jul 9, 2013
Current: 155Edge
12+Supportedsince Jul 29, 2015
Current: 154Firefox
1–21Not supported
22+Supportedsince Jun 25, 2013
Current: 157Safari
1–8Not supported
9+Supportedsince Sep 30, 2015
Current: 27MobileChrome Android
18–27Not supported
28+Supportedsince Jul 10, 2013
Current: 155Firefox Android
4–21Not supported
22+Supportedsince Jun 25, 2013
Current: 157Safari iOS
1–8Not supported
9+Supportedsince Sep 16, 2015
Current: 27How to use
This feature is Baseline widely available — use it freely, no fallback needed.
Example
JS
const sheet = new CSSStyleSheet();
sheet.replaceSync(".highlight { background: yellow; }");
document.adoptedStyleSheets = [...document.adoptedStyleSheets, sheet];Feature detection
JS · check before using
if ("CSS" in globalThis) {
// CSS is available
} else {
// load a polyfill or use a fallback
}Sub-features
Support for each part of the feature (79). The overall table above shows when the whole feature works.
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| CSS | 28 | 12 | 22 | 9 | 28 | 22 | 9 |
| CSSConditionRule | 56 | 12 | 20 | 14.1 | 56 | 20 | 14.5 |
| CSSConditionRule.conditionText | 56 | 12 | 20 | 14.1 | 56 | 20 | 14.5 |
| CSSGroupingRule | 45 | 12 | 20 | 14.1 | 45 | 20 | 14.5 |
| CSSGroupingRule.cssRules | 45 | 12 | 20 | 14.1 | 45 | 20 | 14.5 |
| CSSGroupingRule.deleteRule | 45 | 12 | 20 | 14.1 | 45 | 20 | 14.5 |
| CSSGroupingRule.insertRule | 45 | 12 | 20 | 14.1 | 45 | 20 | 14.5 |
| CSSMarginRule | 131 | 131 | ✕ | ✕ | 131 | ✕ | ✕ |
| CSSMarginRule.name | 131 | 131 | ✕ | ✕ | 131 | ✕ | ✕ |
| CSSMarginRule.style | 131 | 131 | ✕ | ✕ | 131 | ✕ | ✕ |
| CSSMediaRule | 1 | 12 | 1 | 3 | 18 | 4 | 1 |
| CSSMediaRule.media | 1 | 12 | 1 | 3 | 18 | 4 | 1 |
| CSSPageDescriptors | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.margin | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.margin-bottom | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.margin-left | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.margin-right | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.margin-top | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.marginBottom | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |
| CSSPageDescriptors.marginLeft | ✕ | ✕ | 129 | 26 | ✕ | 129 | 26 |