/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

6 votes249 views9 answers
Create a portfolio website with html css
CSS
0 vote238 views1 answer
Nth-of-type(2):before
CSS
0 vote245 views2 answers
How to remove input background on select oin css
CSS
54 votes210 views6 answers
Background color css
CSS
12 votes264 views3 answers
Css background image size fit screen
CSS
113 votes244 views5 answers
Padding css
CSS
0 vote267 views1 answer
Css media query overflow
CSS
0 vote273 views1 answer
Bootstrap modal overflow
CSS
48 votes256 views2 answers
Css clear
CSS
0 vote320 views1 answer
Bouton darkmode
CSS