/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 vote208 views1 answer
Medim size mat form field
CSS
8 votes186 views1 answer
How to get my div to centre of primary div
CSS
0 vote179 views1 answer
Import tailwind
CSS
7 votes136 views4 answers
Radial gradient css
CSS
48 votes190 views2 answers
Css clear
CSS
38 votes183 views3 answers
Use CSS to set the background color of the document (body) to yellow.
CSS
0 vote163 views1 answer
Div overlfow scroll
CSS
1 vote188 views1 answer
Scss nesting
CSS
0 vote192 views3 answers
Slick slider and ACF Pro in WordPress
CSS
0 vote195 views1 answer
Unhover animation
CSS