Tribute page responsive img

Tell us what’s happening:
i cant get the image to align after making The element should responsively resize, relative to the width of its parent element, without exceeding its original size.

Your code so far
#image{
height: auto;
max-width: 100%;
display: block;

<img id= “image” src= “https://thumbor.forbes.com/thumbor/fit-in/416x416/filters%3Aformat(jpg)/https%3A%2F%2Fspecials-images.forbesimg.com%2Fimageserve%2F5f47d4de7637290765bce495%2F0x0.jpg%3Fbackground%3D000000%26cropX1%3D1398%26cropX2%3D3908%26cropY1%3D594%26cropY2%3D3102” alt = “Elon Musk”

Your browser information:

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

Challenge: Build a Tribute Page

Link to the challenge:
https://codepen.io/freeCodeCamp/pen/MJjpwO

1 Like

Try this:

#image {
width: 100%;
height: auto;
max-width: 625px;
margin-left: auto;
margin-right: auto;
display: block;
}

you’re a legend thank you

1 Like

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