- May 26, 2016
- 18
- 0
- 6
I noticed that changing device orientation (android phone) causes screen.width to change. For example on my Huawei android phone when in the portrait position screen.width == 360px while in landscape 640px. Taking into account that (at least as far as i know) screen.width holds device-width property value why the code below:
Doesn't work?
If device-width is linked with screen.width shouldn't it's value change accordingly with the actual device orientation just like screen.width does?
Code:
@media screen and (max-device-width:360px){
div {
background-color: green;
}
}
@media screen and (min-device-width:361px){
div {
background-color: blue;
}
}
If device-width is linked with screen.width shouldn't it's value change accordingly with the actual device orientation just like screen.width does?