This CSS for Media Queries only applies when screen widths between 768px and 1024px and when displayed in Landscape or Portrait.
Example CSS for Media Queries which includes the logical operator and
:
Landscape
Ipad
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
.div {....}
}
Portrait
Ipad
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
.div {....}
}
The
and
operator is used for combining multiple media features together into a single media query, requiring each chained feature to return true in order for the query to be true. Source
Leave a Reply