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
media feature is a Chrome extension whose value is true
if vendor-prefixed CSS 3D transform
s are supported.
Note: This media feature is only supported by WebKit and Blink. If possible, use an @supports
feature query instead.
Example
@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
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
-webkit-transform-3d |
(Yes)[1] | 49 (49)[2] | ? | (Yes)[1] | 1.0[1] |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
-webkit-transform-3d |
? | ? | ? | ? | ? |
[1] See WebKit bug 22494.
[2] Implemented for Web compatibility reasons in Gecko 46.0 (Firefox 46.0 / Thunderbird 46.0 / SeaMonkey 2.43) behind the preference layout.css.prefixes.webkit
defaulting to false
. See bug 1239799. Since Gecko 49.0 (Firefox 49 / Thunderbird 49 / SeaMonkey 2.46) layout.css.prefixes.webkit
defaults to true
.