Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
The -webkit-transform-3d Boolean CSS media feature is a Chrome extension whose value is true if vendor-prefixed CSS 3D transforms are supported.
Note: This media feature is only supported by WebKit and Blink. If possible, use an @supports feature query instead.
Syntax
-webkit-transform-3d is a Boolean CSS media feature whose value is true if the browser supports -webkit prefixed CSS 3D transforms.
Values
true- The browser supports the 3D CSS transforms with the
-webkitprefix. false- The 3D CSS transforms prefixed with
-webkitare not supported by the browser.
Examples
@media (-webkit-transform-3d) {
.foo {
transform-style: preserve-3d;
}
}
@media (-webkit-transform-3d: 1) {
.foo {
transform-style: preserve-3d;
}
}
Specifications
| Specification | Status | Comment |
|---|---|---|
| Compatibility Standard The definition of '-webkit-transform-3d' in that specification. |
Living Standard | Initial standardization |
| Safari CSS Reference 'media query extensions' in that document. |
Non-standard unofficial documentation | Initial documentation |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
-webkit-transform-3d media feature | Chrome No support 2 — 36 | Edge No support 12 — 79 | Firefox
Full support
49
| IE No support No | Opera No support 15 — 23 | Safari Full support 4 | WebView Android No support ≤37 — ≤37 | Chrome Android No support 18 — 36 | Firefox Android
Full support
49
| Opera Android No support 14 — 24 | Safari iOS Full support 3.2 | Samsung Internet Android No support 1.0 — 3.0 |
Legend
- Full support
- Full support
- No support
- No support
- Non-standard. Expect poor cross-browser support.
- Non-standard. Expect poor cross-browser support.
- User must explicitly enable this feature.
- User must explicitly enable this feature.
