Responsive Web Design Certification - Responsive Web Design Principles

HTML-CSS
1

Tell us what’s happening:
HI there - so I am trying to complete one of freecodecamp’s certification courses and am having some trouble with one of the sections. For one of the lessons, I need to make an image responsive using max-width and height features, but I keep receiving an error alert from the test output saying that I need to correct my code. If you can see below in my responsive-img class, I have stated what how I want my image to behave and it falls within the instructions from the lesson. With that said, the test output is still saying that I have not set my responsive-img class to have a max-width of 100%.

This is very confusing and I have not been able to find a resource that has provided a correct solution! Hopefully somebody can help! :weary:

Your code so far


<style>
.responsive-img {
max-width: 100%;
height: auto;
}

img {
width: 600px;
}
</style>

<img class="responsive-img" src="https://s3.amazonaws.com/freecodecamp/FCCStickerPack.jpg" alt="freeCodeCamp stickers set">
<img class="responsive-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/64.0.3282.140 Safari/537.36 Edge/18.17763.

Challenge: Make an Image Responsive

Link to the challenge:
https://www.freecodecamp.org/learn/responsive-web-design/responsive-web-design-principles/make-an-image-responsive

2 Likes
2

This is very interesting. I’ve copied and pasted your code into my lesson and it passes with no problem.
Maybe try another browser?

1 Like
3

Wow okay, I just tried it in Chrome and it worked first try. I was using Microsoft edge before and it gave me the same error message every time.

Thanks a lot Caleb! I was going crazy over a problem that could be solved by changing browsers lol.

1 Like
4

I’m still learning about browser compatibility and how it works with certain things. Many of the things that I work on tend to make me have to go back and fix things to work with Microsoft edge. It might be worthwhile for you to switch to a new browser. But that’s just personal opinion.

Glad I could help! Keep it up, :smile:

5

Yeah, already switched my default browser to chrome.

Thanks again for the help! :wave:

6

great compliments, you explained what’s going on!
10/10 keep at it and level loose the explanation of what kind of help you need

2 Likes