Failing User Story #8 + #9

Hi everyone! My Tribute page is almost finished… I just need to fix up my code for User Stories #8+9. How do I align my image to center and make it responsive?

This is the code I have so far:
HTML:

<div id="img-div">
      <img id="image" src= "https://i.guim.co.uk/img/media/1a2240580e9f9a666d6d9ae06be295dc769f7c2f/174_59_3033_1820/master/3033.jpg?width=1020&quality=85&auto=format&fit=max&s=185d9faa7b76e39620a90746f47a9240" alt="Bethany Hamilton shredding gnarly waves">

CSS:

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

Here’s my Codepen for you to check out too:

Tribute Page Codepen

Any help would be greatly appreciated!

HI @rikainocalla !

Welcome to the forum!

You first need to remove the style tags from the css section.
Style tags are html elements and do not belong in css.

Once you fix that, then you should get 9/10.

As for the failing user story, you need to research how to center and image.
I would suggest google that exact phrase and the first result will give you the answer.

Remember that a big part of these projects is learning how to research for answers :grinning:

Once you fix that, then all test will pass

try using the img-div for the CSS
and try only width not max-width

AMAZING!! All I did was remove the style tags, and I passed! Thank you so much!!

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