Tribute Project - max-width question

1

https://codepen.io/rthomson/full/ExjKYPJ

The linked project, with a fixed 700px max width does not rescale the picture as the browser shrinks. If I change the 700px to 80% it works as desired. The test suite passes with either max-width value. What am I missing here?

I posted this to the wrong subforum (Programming Help) and didn’t receive a reply so am reposting here.

2

Hi @rthomson

You could set the desired width on the <img>:

    <img id="image" width="700px" src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/6b/Charles_Babbage_-_1860.jpg/800px-Charles_Babbage_-_1860.jpg">

And max-width to 100% in the CSS:

        #image {
            display: block;
            margin: 0 auto;
            max-width: 100%;
        }