Can you spot why my image isn't responsive?

Hey there, I’m on the responsive website project but I can’t get the image to shrink along with my screen size. I set the max width to 90% but it doesn’t work.

Here’s my code: https://codepen.io/arshia93/pen/abmVKex

Thank you!

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36.

Challenge: Build a Tribute Page

Link to the challenge:

Hello @am93.
It is because you are applying the properties to the image inside media query. Apply the following outside the media query .

#image {
  width: 100%;
  display: block;
  height: auto;
  margin: 0 auto;
}

you are missing a colon after max-width.
a working example can be found here

it should be

 #image {
  max-width: 90%;
  display: block;
  height: auto;
  margin: 0 auto;
}

@dascolt1 ah man, I didn’t notice that even after looking over it multiple times :confused: Thank you!

1 Like