What is the difference between these two instructions?
@media screen and (max-device-width: 480px) {}
and
@media only screen and (max-device-width: 480px) {}
Add a comment
|
1 Answer
The keyword ‘only’ can also be used to hide style sheets from older user agents. User agents must process media queries starting with ‘only’ as if the ‘only’ keyword was not present.
From http://www.w3.org/TR/css3-mediaqueries/
In real use scenarios, the only screen query is used to target specific mobile browsers that support modern CSS.
From http://www.alistapart.com/articles/return-of-the-mobile-stylesheet
Even more clearly
Prefixing a media queries with the "only" keyword will cause non CSS3-compliant browsers to ignore the rule.
answered Jan 11, 2012 at 19:10
