CODEWITHSUNDEEP
htmlcssmedia-queries
Berbatov
Berbatov

Reputation: 1063

Combine CSS mediaqueries conditions

I'm looking for a way to combine several CSS mediaquery conditions. I want to apply certain rules when

a) the max-width is 480 OR b) the max-width is 800 given the orientation of the device is landscape

Is it possible to put that in one statement? I could obviously make two rules and give them both the same CSS stuff, but that's not very efficient

Thanks in advance

edit: please see additional comment below

Upvotes: 1

Views: 99

Answers (1)

omma2289
omma2289

Reputation: 54649

Given that most computer monitors nowadays will have a wider resolution, you could use max-device-width to distinguish mobiles from desktops:

@media screen and (max-device-width: 800px) and (orientation:landscape), screen and (max-width: 480px)

Note that the queries are separated by comma which is equivalent to a logical "OR" operator

Upvotes: 1

Related Questions