Max-Width not working for >img>

Tell us what’s happening:

#Layout

  • 1. 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’

Your code so far
https://Nisha-Tribute-Page.nbhawnani.repl.co

Your browser information:

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

Challenge: Build a Tribute Page

Link to the challenge:

Can you share a link to the code?

It would be better than us having to open up the dev tools.

Edit: It looks like you have a few inline styles but there are some errors.

style="width=:100%;max-width:100;align:center;height:auto;"

I would ditch the inline styles and move everything to the css section and make sure the syntax is correct.

1 Like

https://Nisha-Tribute-Page.nbhawnani.repl.co

1 Like

Did you make any changes?

It still looks the same to me.

I was hoping to get some suggestions as to what to change to make it work

Have you tried moving all of your styles to the css section like I suggested earlier?

img {
width:100%;
height:auto;
... etc
}

I would try that first.
Having all of your css separate from the html will make it easier to find your issue instead of placing it all inline.

Also, the test message has changed. Reopen the test suite to read the new error message.

Also, be careful about this align:center.
I think you meant text-align:center
But there are other ways to center an image.

If you google how to center image css, then you will get the code on how to do that.

Hope that helps!

it worked - thanks much for your help!

1 Like

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