Tribute Page - Build a Tribute Page

It’s saying everything is correct, it’s all ticked except for one cross where it says You should have a figcaption or div element with an id of img-caption. I do have this so I’m really confused and can’t figure out what I’ve done wrong.

<!-- file: index.html -->
<!DOCTYPE html>
  <html>
    <head>
      <meta charset="UTF-8">
      <title id="title">Sea Hawk</title>
      <link rel="stylesheet" href="styles.css">
    </head>
    <body>
      <main id="main">
        <div id="img-div">
          <h1 class="center">Captain Sea Hawk</h1>
          <p id="img-caption" class="center">
            A courageous, strong and very skilled pyromaniac/sea captain with an incredibly lushious and shiny moustache.
          </p>
          <img id="image" src="https://preview.redd.it/37nqcxa0wyw71.jpg?width=625&format=pjpg&auto=webp&s=0d605a6104b84f0ef48bd29864015474e1594016" class="centered-image">
          <figcaption 
          id="img-caption">Captain Sea Hawk doing what he does best as the legend he is. And being the Sea Captain with the most epic and shiny moustache.
            </figcaption>
          <p id="tribute-info">
            Captain Sea Hawk's story is a harrowing tale with many ups and downs. He started off with his own crew and many friends. However, things swiftly changed as they all left him due to the fact they could not appreciate his ability to set boats on fire. He was very accomplished and is the only known sea captain to be able to navigate the treachorous waters from Bright Moon to the sea town of Salineas, who's leader is the princess Mermista. Speaking of which Sea Hawk and Mermista know each other very well. And she totally does not find him annoying at all and they are totally friends. He is undefeated at arm wrestling and one day he was in a tavern arm wrestling, and winning. When a sparkly girl, a girl with a large sword and a boy named after his weapon of choice approached him. They claimed they needed an experienced sea captain to bring them to Salineas to see princess Mermista and he clearly fitted the glove perfectly. They however could not pay his very reasonable price and were leaving until the one with the big sword challenged him to an arm wrestle in exchange to take them to Salineas. He gracefully let her win in order to boost her ego and they set off. He was a master navigator and captain making sure they were all earning their keep as crew. He fought giant sea monsters and finally they arrived. They spoke with Mermista and the one with the big sword got taller and started doing something to the wall that protects the city. He courageously guarded the boat until he saw the horde was attacking his new friends. Luckily for them he was able to use his excellent abilities to set his boat on fire and thwart the horde's evil plans in turn saving their lives and once again saving the day. Now he travels the seas in his new boat princess Mermista gifted him. Completing more heroic actions no doubt.For more information <a id="tribute-link" target="_blank" href="https://she-raandtheprincessesofpower.fandom.com/wiki/Sea_Hawk">click here</a>
          </p>
        </div>
      </main>
    </body>
  </html>
/* file: styles.css */
* {
  background-color: rgb(10, 10, 10);
}

.center {
  text-align: center;
}

h1, p, figcaption {
  font-family: verdana;
  color: rgb(200, 200, 200);
}

.centered-image {
  height: auto;
  display: block;
  justify-content: center;
  max-width: 100%;
}

a {
  color: rgb(0, 0, 200);
}

Your browser information:

User Agent is: Mozilla/5.0 (X11; CrOS x86_64 14816.131.0) 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:

Yes, you do have a figcaption with and id of img-caption, but you also have a p element with the same id. Technically, id’s must be unique in HTML, so you can’t use the same id for two separate elements. And this is in fact throwing the tests off and causing this test to fail.

1 Like

Ok, this helped. Thank you.

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