Menu
media query for browser size where width < height?
I tried
@media screen and (max-width: 700px) and (min-height: 700px) {
But that does not work. Please help.
Use Case:
306
Take a look: @media only screen and (min-width: 360px) and (max-width: 768px) { // do something in this width range. } The media query above will only work for the feature expression (the screen size of the mobile device that you're writing a style for) provided above.
Combining media query expressions Max-width and min-width can be used together to target a specific range of screen sizes. @media only screen and (max-width: 600px) and (min-width: 400px) {...} The query above will trigger only for screens that are 600-400px wide.
Use a comma to specify two (or more) different rules: @media screen and (max-width: 995px), screen and (max-height: 700px) { ... } Commas are used to combine multiple media queries into a single rule. Each query in a comma-separated list is treated separately from the others.
The min-width media feature specifies the minimum width of a specific device. For instance, in the above section, we have enlisted some screen widths on the basis of the device type such as the minimum screen width of mobile devices is 320px.
There's a special media query right for your needs.
The orientation media query allows us to target specific styles based on the current screen or device orientation. We have 2 properties; landscape and portrait which allow us to change a pages layout based on the browsers current orientation.
A browser or device determines the orientation by listening to the width and height of the window. If the height is larger than the width the window is in portrait mode. If the width is larger than the height it’s in landscape mode.
/* Portrait */
@media screen and (orientation:portrait) {
/* Portrait styles */
}
/* Landscape */
@media screen and (orientation:landscape) {
/* Landscape styles */
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
