Build a Tribute Page - 9/10 correct

I am having a problem getting my image to be responsive and its the last test I need to pass to complete the project.

link: https://codepen.io/james-f-thomas-sfg-ii/pen/gOOXXKJ

I have gone through all related posts to attempt switching in and code but I’m still unable to get the picture to responsively resize to parent element.

wrapped it in an container, took it out the container, set parameters for whole page, and for specific classes identified but I’m still not able to make that damn pic responsive.

I know it’s something simple but I’m unable to find the error in layout or written in out in commands.

Your CSS isn’t targeting the required image. You have a CSS rule for .img-d (which has some of the required styles), but your image doesn’t have that class.

1 Like

OK, there are a couple of things you should pay attention to here. Take a look at the selector. You’re using .img-d in CSS but your image has class name that’s different from this (and plus, you need to change the quotes for the class attribute in HTML for this element!). After you do this, run the test again, you’ll fail but try to figure out why on your own, click on the ‘Tests 9/10’ button and you should see why you’re failing that part, the instructions should be pretty straightforward from now on :slight_smile:

Hope this helps and ask if you’re still stuck. Good luck! :smiley:

1 Like

hey thanks comrade. changed the what my CSS style sheet was targeting and I was able to pass that challenge.

Thanks, so I changed my CSS selector passed the resizing challenge.
You were right, I still failed because now the image wouldn’t center in the parent element.
So i tried to align the elements within the parent div “img-div” but that didn’t work for some reason.
i eventually used ~margin:0 auto;~ in the CSS for the image which I gave the class “responsive” and it worked.
I don’t know if that is what you meant to do but that passed.

Thanks for the help.

1 Like