Tribute Page - Build a Tribute Page

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**
  am trying to build a tribute page...please kindly check my code cos is not passing.
  1. My main element of id is not pass
  2. Display of block in image element is not passing
    3.my image should be centered within its image…
    i need a hint to go about this…thanks
/* file: index.html */



<link rel="stylesheet" href="styles.css">

<main>


<div id="main">

<h1 id="title">Dr. Norman Borlaug</h1>


<div id="img-div">

<img id="image" max-width="100" height="auto"></img>
 

<figcaption 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.</figcaption>

</div>


<p id="tribute-info">The man who saved a billion lives

</p>

<a id="tribute-link" target="_blank" href=""></a>

</div>


</main>
/* file: styles.css */








  **Your browser information:**

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

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

Looking good so far. Keep going!

  1. Double check which element needs to have id="main". Re-read the first user-story.

  2. Take away the </img>, the ‘img’ tag is self-closing, so it will look like this <img src="">.

  3. Add a link to the image you’d like to use in your page, so you can see how the image gets positioned. To center the image, you will need to use display: flex; on the “parent” of the image. This will let you use justify-content: center; and align-items: center; to position everything inside that “parent element”

  4. Writing max-width like this: <img id="image" max-width="100" height="auto"> doesn’t work. So try writing it in your css file instead. You can use your images id="image" to do it!!

Read over each point carefully, and tackle each point one at a time. You got this!

thanks…i will tackle carefully.