Make an Image Responsive something missing?

HTML-CSS
1

Tell us what’s happening:
I think I got this one right but it does not pass all green and it says " Your img tag should have a display set to block." And it is!

Your code so far


<style>
  
</style>

<img{ max-width:100%; 
     display:block;  
     height:auto;}
src="https://s3.amazonaws.com/freecodecamp/FCCStickerPack.jpg" alt="freeCodeCamp stickers set">

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.77 Safari/537.36.

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

2

It wants you to add the style between the style tags.

1 Like
3

Like @br3ntor has pointed out, you need to add the styles between the style tag.

To elaborate further, the last line, the line with the image URL. That is an HTML tag and to apply CSS to it, you would need to target that element in a syntactically valid way.

In other words, target the following tag (which is the image):

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

To do so, simply place the styles inside the tag:

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

Anyway hope that helps.

1 Like
4

Thank you guys! It`s crazy that I missed that part :frowning: Lesson learned!