Tribute Website challenge help

Hi everyone! I can’t seem to pass the test of resizing the image to make it responsive, even though it does resize. I used Bootstrap and media query for this.

Could someone help me please?

Here is my code:

https://codepen.io/valereyes28/pen/WNpOpvR

Hi @valereyes28 !

Welcome to the forum!

You have to make sure to read the full error message.
There are a total of three things that you will have to do to pass the test.

Open up the test suite and it will tell you what to add.
Once you fix one change the error message will change.
You need to keep read the changing error messages until the test passes.

This a tip to remember for all of the projects.
Reading the full error messages will help you :grinning:

Hi! Thank you, but I have read the message, and it says:

"The element should responsively resize, relative to the width of its parent element, without exceeding its original size.

Try using the “max-width” style property : expected ‘none’ to not equal ‘none’ AssertionError: Try using the “max-width” style property : expected ‘none’ to not equal ‘none’"

I still do not understand, because I tried max-width: none and it still doesn’t pass the test.

I just tested you code and as I mentioned earlier there are three things you have to change.

The problem is you are only reading the first error message about the max-width property.

But there are two other error message that show up after you fix the max-width issue.
You have to keep opening up the test suite to read the new error message.

There will be a total of three.
It might look like nothing happened and it says 9/10 but the error message does change.
You just have to keep looking.

Once you make those three changes then the test will finally pass.

Hope that is clear now.

@valereyes28 you’re reading the error message incorrectly. It says

The <img> element should responsively resize, relative to the width of its parent element, without exceeding its original size.
Try using the "max-width" style property : expected 'none' to not equal 'none'
AssertionError: Try using the "max-width" style property : expected 'none' to not equal 'none'

The error message is not telling you to set max-width to a value of “none”. It’s saying you don’t have a max-width property. And looking at your code, you do not. You have a width property. You have to change that.

When you do you’ll get another error message. It will be different. Follow it carefully.
Ask again if there’s something you don’t understand.

1 Like

THANK YOU! I get it now, and yes, I was reading it wrong! (I feel so dumb now, thinking for days why max-width: none didn’t work xD )

Thank you so much, to both of you! <3

Glad to have helped.
Don’t feel bad. We’ve all been there. Good job on getting the tests to pass.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.