Issue with "Build a Tribute Page" project and the element "figcaption"

HTML-CSS
1

For my “Build a Tribute Page” project one test keeps failing and I know the code looks correct.
The test failing is this one -
You should have a figcaption or div element with an id of img-caption .

Hear is the code :

<!DOCTYPE html>
<html>
  <head>
    <title>Dr. Norman Borlaug</title>
    <link rel="stylesheet" href="styles.css" />
  </head>

  <body>
    <main id="main">
      <header class="header">
        <h1 id="title">Dr. Norman Borlaug</h1>
        <p id="img-caption">The man who saved a billion lives</p>
      </header>
      <figure id="img-div">
        <img
          id="image"
          src="https://cdn.freecodecamp.org/testable-projects-fcc/images/tribute-page-main-image.jpg"
        />
        <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>
      </figure>
      <section id="tribute-info">
        <h3 id="headline">Here's a time line of Dr. Borlaug's life:</h3>
        <ul>
          <li>
            <strong>1914</strong>
            - Born in Cresco, Iowa
          </li>
          <li>
            <strong>1933</strong>
            - Leaves his family's farm to attend the University of Minnesota,
            thanks to a Depression era program known as the "National Youth
            Administration"
          </li>

          <li>
            <strong>1935</strong> - Has to stop school and save up more money.
            Works in the Civilian Conservation Corps, helping starving
            Americans. "I saw how food changed them", he said. "All of this left
            scars on me."
          </li>

          <li>
            <strong>1937</strong> - Finishes university and takes a job in the
            US Forestry Service
          </li>
        </ul>
      </section>
      <footer>
        <p>
          If you have time, you should read more about this incredible human
          being on his
          <a
            href="https://en.wikipedia.org/wiki/Norman_Borlaug"
            id="tribute-link"
            target="_blank"
          >
            Wikipedia entry.</a
          >
        </p>
      </footer>
    </main>
  </body>
</html>
2

To display your code in here you need to wrap it in triple back ticks. On a line by itself type three back ticks. Then on the first line below the three back ticks paste in your code. Then below your code on a new line type three more back ticks. The back tick on my keyboard is in the upper left just above the Tab key and below the Esc key. You may also be able to use Ctrl+e to automatically give you the triple back ticks while you are typing in the this editor and the cursor is on a line by itself. Alternatively, with the cursor on a line by itself, you can use the </> button above the editor to add the triple back ticks.

3

For some reason didn’t like the header and footer. Done

4

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