CODEWITHSUNDEEP
htmlcssmedia-queries
Nishant Guleria
Nishant Guleria

Reputation: 1

How does (orientation: landscape) really work in CSS Media Queries?

Acccording to the preffferd css syntax i am applying the Media Query and it doesnt change anything. This is not giving me any changed output. Help.!

  /* Landscape */
  @media only screen 
   and (min-device-width: 320px) 
   and (max-device-width: 480px)
   and (-webkit-min-device-pixel-ratio: 2)
   and (orientation: landscape) {
     .someClass{
         display: none;
         }
   }

Upvotes: 0

Views: 606

Answers (2)

Ashwin
Ashwin

Reputation: 323

This isn't giving you an output since the usage is wrong. You want to use the property with an HTML selector.

Right syntax:

/* Landscape */
  @media only screen 
   and (min-device-width: 320px) 
   and (max-device-width: 480px)
   and (-webkit-min-device-pixel-ratio: 2)
   and (orientation: landscape) {
     body {
      display: none;
     }
   }

Upvotes: 1

Jarno van Klaarbergen
Jarno van Klaarbergen

Reputation: 1

   @media only screen 
   and (min-device-width: 320px) 
   and (max-device-width: 480px)
   and (-webkit-min-device-pixel-ratio: 2)
   and (orientation: landscape) {
     *{ display: none; }
   }

Try this, you didn't select anything to hide

Upvotes: 0

Related Questions