width is a CSS media feature that can be used to apply styles conditionally based on the width of the viewport. The width must be specified as a <length> value.</length>
Syntax
width is a range value meaning the prefixed min-width and max-width are also available.
/* Exact width */
@media (width: 300px) {}
/* Viewport width at least */
@media (min-width: 50em) {}
/* Viewport width at most */
@media (max-width: 1000px) {}
Specifications
| Specification | Status | Comment |
|---|---|---|
| Media Queries Level 4 The definition of '@media' in that specification. |
Working Draft | No change. |
| Media Queries The definition of 'width' in that specification. |
Recommendation | Initial definition. |
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | (Yes) | (Yes) | 9 | (Yes) | (Yes) |
| Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | ? | ? | ? | ? | ? |