Resonsive Web Design: making an Image resonsive

HTML-CSS
1

I have completed the challenge several times but keeps telling me I need to add my max-width to 100%, which I have. I watch the video and even looked at the hint.
My code is as follows:

.responsive-img {
max-width: 100%;
display: block;
height: auto;
}

I keep getting it as wrong. please help.
Thank you
Awoolley

Your code so far


<style>
.responsive-img {
max-width:100%;
display: block;
height: auto;
}
img {
width: 600px;
}
</style>

<img class="responsive-img" src="https://s3.amazonaws.com/freecodecamp/FCCStickerPack.jpg" alt="freeCodeCamp stickers set">
<img src="https://s3.amazonaws.com/freecodecamp/FCCStickerPack.jpg" alt="freeCodeCamp stickers set">

Your browser information:

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

Challenge: Make an Image Responsive

Link to the challenge:

2

Hmm… your code worked for me. Maybe try refreshing?

1 Like
3

I have…but I am willing to try again (:

4

Refreshed page, restarted code, still getting an error saying I need to make my max-width 100%. I skipped it and moved on, however, I don’t like it not finished.

5

Hey @Awoolley,

  • Your code works fine for me. It looks like you are using the older version of Edge 44. I would recommend you to update to the new Edge, because it is built upon the Chromium Browser. Or you can just Use Chrome, it’s completely up to you :slight_smile:
    Here’s the links:

Chromium Edge:

Chrome:


Hope this helps, Remember to Stay Safe and Happy Coding!!:slight_smile:

Catalactics

6

Thanks. I will try that now.

7

that worked. Thank you. I never got anything asking me to update my mirosoft browser, so thank you.