Media Query Practice

I’m trying to enlarge the image I’m using when the screen reaches a maximum width of 600px. I thought my media query below would’ve worked but is adding no effect when screen reaches that size.

#center {
     display: block;
     margin: auto;
     width: 25%;
  position: relative;
  left: 15px;
  background: linear-gradient(90deg, #004ff9, #fff94c);
@media (max-width: 600px) {
     width: 40%;

<DOCTYPE html>
    <title> Yanzoz </title>
    <meta charset="utf-8">
<img src="../images/yanzoz-logo-remake.png" alt="Yanzoz" id="center">

Try giving it min-width instead of max-width.

max-width means size up to this width

you were correct… I applied the min-width to the the class selector though and it worked, I’m now wondering why a regular width attribute did not …

Thank you…