/CSS/Media query for max width and height

Media query for max width and height

Min and max width media query

@media (max-width: 989px) and (min-width: 768px) {}

Media max height css

@media only screen and (max-height: 500px) {
  /* place here CSS for when the screen is less than 500px tall */
  .card {
    width: 100%;
  }
}

Source: youtube.com

Media query for max width and height

@media only screen and (max-width: 535px), screen and (max-height:550px ) {
}

What is a max and min width media query

/* What this query really means, is If [device width] is less than or equal to 600px, then do */
@media only screen and (max-width: 600px)  {...}

/* What this query really means, is If [device width] is greater than or equal to 600px, then do */
@media only screen and (min-width: 600px) {...}

Media query min and max width

@media screen and (max-width: 992px) {
  body {
    background-color: blue;
  }
}

Similar codes

-1 vote448 views2 answers
Insert image by css
CSS
5 votes374 views1 answer
Force to load https
CSS
5 votes333 views1 answer
Css custom strikethrough
CSS
1 vote372 views1 answer
React hide scrollbar
CSS
21 votes376 views2 answers
Remove color and underline from link css
CSS
32 votes400 views6 answers
Alert bootstrap
CSS Bootstrap
26 votes374 views10 answers
Bootstrap
CSS
0 vote399 views2 answers
What is the request payload in jaavascript fetch
CSS
0 vote343 views1 answer
Style jQuery draggable clone
CSS
0 vote380 views1 answer
Image css in box
CSS