Tribute Page - Build a Tribute Page

Tell us what’s happening:
the only ones not working was:

  1. Your img element should have a display of block .
  2. Your #image should have a max-width of 100% .

how do i do this please

Your code so far

<!-- file: index.html -->
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="Tribute Page" content="Project/>
    <title>Tribute Page</title>
    <link rel="stylesheet" href="styles.css" />
  </head>


<main id="main">
  <header id="title">
    <h1>Nikola Tesla</h1>
    </header>
    <body>
      <div id="img-div">
      <div id="img-caption">The forgotten genius ahead of his time</div>
      <img id="image" src="https://cdn.britannica.com/49/4649-050-BB5F0463/Nikola-Tesla.jpg" width="100%"  >
      </div>
      <div id="tribute-info">Attempting to develop inventions he could patent and market, Tesla conducted a range of experiments with mechanical oscillators/generators, electrical discharge tubes, and early X-ray imaging. He also built a wirelessly controlled boat, one of the first ever exhibited. Tesla became well known as an inventor and demonstrated his achievements to celebrities and wealthy patrons at his lab, and was noted for his showmanship at public lectures. Throughout the 1890s, Tesla pursued his ideas for wireless lighting and worldwide wireless electric power distribution in his high-voltage, high-frequency power experiments in New York and Colorado Springs. In 1893, he made pronouncements on the possibility of wireless communication with his devices. Tesla tried to put these ideas to practical use in his unfinished Wardenclyffe Tower project, an intercontinental wireless communication and power transmitter, but ran out of funding before he could complete it.</div>
      <a id="tribute-link" href="https://en.wikipedia.org/wiki/Nikola_Tesla" target="_blank">

    </body>
</main>
</html>
/* file: styles.css */
img {
  display: block;
}

#image {
  max-width: 100%;
  height: auto;
}

Your browser information:

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

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

Not sure why, but the second quote here is not correct. Can you erase it and copy the quote you used on the left of stylesheet instead?

1 Like