Responsive Web Design Projects - Build a Tribute Page

stuck at

  1. Your img element should have a display of block.

2.Your #image should have a max-width of 100%.

  1. Your #image should be centered within its parent.

Your code so far


The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.


       <div class="img-container" id="img-div">
            alt="Dr. Norman Borlaug with his mates"
          <div class="caption" id="img-caption">
             Dr. Norman Borlaug, third from the left, trains biologists in Mexico on how to increase wheat yields - part of his life-long war on hunger.

    margin: 60px;
    padding: 65px;
    border-radius: 20px;

    object-fit: contain;
    border-radius: 10px;
    max-width: 100%;
    display: block;
    height: auto;
    margin: auto;
    padding-top: 5px;

Your browser information:

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

Challenge: Responsive Web Design Projects - Build a Tribute Page

Link to the challenge:

to fix these, you need to make sure you have linked your stylehseet and that it contains a selector for #image and a selector for .img that satisfy these requirements.

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