Help with Tribute Page! Step 8

1

So I’ve been working on this since yesterday and been stuck on the last step 8/9

‘’ User Story #8: The img element should responsively resize, relative to the width of its parent element, without exceeding its original size.’’

I don’t know what I’m doing wrong and why it isn’t passing. I’d appreciate if someone could help :slight_smile:

https://codepen.io/DangerousPilot/pen/PoqreVj

1 Like
2

Hi there, the test wasn’t passing because you need to set the display property of the #image to the value block with display: block;

Then you need to use your left and right margins to center the picture again. The tests should then all pass.

let me know if you need any more help or if you are still stuck.

Good luck :smiley:

2 Likes
3

The height and width both need to be auto and the display block instead of the default inline.

#image {
 display: block;
 text-align: center;
 max-width: 100%;
 height: auto;
 width: auto;
}
1 Like
4

Thanks man, tried it and it worked, for some reasons though I had to change the picture as it wouldn’t work with the old pic. :slight_smile:

1 Like