Am not getting the desired output

HTML-CSS
1

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

am not getting the write output . i followed the hints but still am not getting the output

2

Hi @basilsunnyalukka
Welcome to the FCC forum.

Try to add the same properties and values to the .responsive-img. That should be all there is to do … So the width adapts to the available space and the height gets calculated automatically according to the width.

image
image711×334 42.6 KB

3

freecodecamp
freecodecamp1364×694 150 KB
i did that ! i think there is something wrong internaly

4

can you click on the link reset the code and try if you get the output or not

5

I suggest you reset your code and also maybe try on different browsers.

6

Tried that, it works for me.
Have you tried a different browser as @passive suggests or cleared your cache?

1 Like
7

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

did the right code still i can move to the next challenge !

8

@basilsunnyalukka Hey , You have added the attributes required to pass this challenge in the img which is wrong , you have to create a class .responsive-img and add the max-width and height values to it , don’t change the given code.

1 Like
9

i didnt modify anything . can you reset the code and run it yourself . i think its an internal error . sorry if i was wrong . thank you BTW

10

@basilsunnyalukka

This is what your code should look like from the above snippet which you pinned you have edited the img tag .

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

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

Please do not create duplicate topics for the same challenge/project question(s). I have merged your topics.

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