/CSS/What is a max and min width media query

What is a max and min width media query

Media query min and max

/* Max-width */
@media only screen and (max-width: 600px)  {...}

/* Min-width */
@media only screen and (min-width: 600px)  {...}

/* Combining media query expressions */
@media only screen and (max-width: 600px) and (min-width: 400px)  {...}

Min and max width media query

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

Css media screen

@media (max-width: 991px){
    .mobile{
        display: block;
    }
}

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) {...}

Similar codes

0 vote345 views1 answer
Css offset border
CSS
17 votes381 views5 answers
Sass react
CSS
190 votes544 views6 answers
How to use css in html
CSS
33 votes396 views6 answers
Css flex center
CSS
1 vote373 views2 answers
How to upgrade composer ubuntu
CSS
0 vote351 views2 answers
Optional changing n
CSS
6 votes314 views1 answer
Float css examples
CSS
0 vote371 views1 answer
Cheat codes for hmtl and css
CSS
7 votes396 views2 answers
Text align justify
CSS
0 vote393 views1 answer
Tailwind css react craco
CSS