Unresponsive image

HTML-CSS
#1

Tell us what’s happening:
I came back to this lesson to make my image responsive for my tribute webpage…

I have tried so many different ways to incorporate the simple code in this lesson to my image but it’s still not responding!!! I’ve spent hours on this now and need a little help.

Everything else in the code works fine (the box shadow, margin auto keeping it in the middle of the page). I have even tried deleting the rest of the code, just keeping the responsive elements and it still doesn’t work! I’ve tried giving it a width value as well as the responsive elements and that doesn’t work. I’ve tried youtube videos which have told me the same thing to do as in this lesson!

Your code so far

#image { box-shadow: 10px 15px 10px rgba(96, 62, 32, 0.30), 8px 8px 8px rgba(96, 62, 32, 0.25); display: block; margin: auto; max-width: 100%; height: auto;

James Jamerson playing bass guitar
James Jamerson playing bass guitar768×512

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.80 Safari/537.36 Edg/86.0.622.43.

Challenge: Make an Image Responsive

Link to the challenge:

#2

is your request for help about the tribute page?

try to don this, run the tests, click on the number of passed tests, scroll down to the failed ones and read the error message below them, see if reading that you can figure out what to do

#3

Yeah, no worries. before testing I figured out what the issue was. I had to make the

my image was nested within responsive as well as the image itself. after I had done that, it was all good.

Thanks for getting back to me though.

#4