CSS Device Adaptation is a module of CSS that lets you define the size, zoom factor, and orientation of the viewport.
Reference
At-rules
Specifications
Specification | Status | Comment |
---|---|---|
CSS Device Adaptation | Working Draft | Initial definition |
Browser compatibility
@viewport
rule
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 | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
@viewport | Chrome
No support
29 — 84
| Edge
Full support
12
| Firefox
No support
No
| IE
Full support
10
| Opera
Full support
16
| Safari
No support
No
| WebView Android No support 4.4 — 37 | Chrome Android
No support
29 — 84
| Firefox Android
No support
No
| Opera Android
Full support
16
| Safari iOS
No support
No
| Samsung Internet Android Full support 2.0 |
height descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera
Full support
16
| Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android
Full support
16
| Safari iOS No support No | Samsung Internet Android Full support 2.0 |
max-height descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera
Full support
16
| Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android
Full support
16
| Safari iOS No support No | Samsung Internet Android Full support 2.0 |
max-width descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera
Full support
16
| Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android
Full support
16
| Safari iOS No support No | Samsung Internet Android Full support 2.0 |
max-zoom descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera Full support 16 | Safari No support No | WebView Android No support No | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android Full support 16 | Safari iOS No support No | Samsung Internet Android Full support 2.0 |
min-height descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera
Full support
16
| Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android
Full support
16
| Safari iOS No support No | Samsung Internet Android Full support 2.0 |
min-width descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera
Full support
16
| Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android
Full support
16
| Safari iOS No support No | Samsung Internet Android Full support 2.0 |
min-zoom descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera Full support 16 | Safari No support No | WebView Android No support No | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android Full support 16 | Safari iOS No support No | Samsung Internet Android Full support 2.0 |
orientation descriptor | Chrome No support No | Edge
No support
12 — 79
| Firefox No support No | IE
Full support
10
| Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android No support No | Opera Android
No support
11.1 — 14
| Safari iOS No support No | Samsung Internet Android No support No |
user-zoom descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera Full support 16 | Safari No support No | WebView Android No support No | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android Full support 16 | Safari iOS No support No | Samsung Internet Android Full support 2.0 |
viewport-fit descriptor | Chrome No support No | Edge No support No | Firefox No support No | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android No support No | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
width descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera
Full support
16
| Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 29 — 84 | Firefox Android No support No | Opera Android
Full support
16
| Safari iOS No support No | Samsung Internet Android Full support 2.0 |
zoom descriptor | Chrome No support 29 — 84 | Edge
Full support
12
| Firefox No support No | IE
Full support
10
| Opera Full support 16 | Safari No support No | WebView Android No support 4.4 — 37 | Chrome Android No support 61 — 84 | Firefox Android No support No | Opera Android Full support 16 | Safari iOS No support No | Samsung Internet Android Full support 8.0 |
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.
- See implementation notes.
- User must explicitly enable this feature.
- User must explicitly enable this feature.
- Requires a vendor prefix or different name for use.
- Requires a vendor prefix or different name for use.