Issue
Im learning @media querry and i've seen some codes with min-width and some codes with max-width. What is the difference? Wich is better for the usage in @media querry. Thx
I've tried both (min-width and max-width) but I was unable to see a differnce.
Thanks in advance
Solution
Let's say you want the background-color of the body tag to be black for screen sizes smaller than 800px, you need to use max-width, which means only apply these styles if the width of the screen is not bigger than 800px(the maximum width is 800px).
@media only screen and (max-width: 800px) {
body {
background-color: black;
}
}
but if you want a style to be applied for screen sizes which are at least 800px wide(bigger than 800px), you should use min-width instead.
@media only screen and (min-width: 800px) {
body {
background-color: red;
}
}
Answered By - jessica-98
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.