Home/ Questions/Q 7041521
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T02:03:21+00:00

What is the difference between these two instructions? @media screen and (max-device-width: 480px) {}

  • 0

What is the difference between these two instructions?

@media screen and (max-device-width: 480px) {}

and 

@media only screen and (max-device-width: 480px) {}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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.

    From http://www.html5rocks.com/en/mobile/mobifying.html

    • 0