CODEWITHSUNDEEP
cssmedia-queries
Chris Muench
Chris Muench

Reputation: 18318

css media query max-device-width

If I have css 3 media query for max-device-width does this change when the orientation of the device changes?

For example if an iPhone goes from portrait to landscape does the max-device-width change?

Upvotes: 1

Views: 1126

Answers (2)

zEn feeLo
zEn feeLo

Reputation: 1978

It doesnt change the orientation

@media screen and (orientation:portrait) {
/* Portrait styles */
}
@media screen and (orientation:landscape) {
/* Landscape styles */
}

Upvotes: 0

user1726343
user1726343

Reputation:

This differs from iPhone, iPad etc to other devices. With Apple products, the device-width values remain the same, but with other devices changing the orientation could cause alternative rules to apply.

The most reliable way to do this is to use min/max-width instead of min/max-device-width. These are dependent on the size of the viewport, and are consistent across devices.

Upvotes: 2

Related Questions