Tribute Page - Build a Tribute Page

HTML-CSS
1

Tell us what’s happening:

the css for my tribute page is not working pls,any helper?Your img element should have a display of block.Your #image should have a max-width of 100%.Your #image should be centered within its parent.

Your code so far

<!-- file: index.html -->
<!doctype>
<html>
  <head>
     <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tribute Page</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
<main id="main">
    <div id="title">Dr. Norman Borlaug</div>

    <figure id="img-div">
       <img id="image" src="C:\Users\Lesli\OneDrive\Pictures\WIN_20230523_17_32_01_Pro.jpg" alt="Image Description">
       <figcaption id="img-caption">Caption for the image</figcaption>
 <a id="tribute-link" href="https://example.com" target="_blank">Learn More</a>
       <div id="tribute-info"> God with us
       </div>
    </figure>


   
</main>

  </body>
</html>


/* file: styles.css */
image {
    display: block; 
    max-width: 
    margin: 0 auto; 
}

Your browser information:

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

Challenge Information:

Tribute Page - Build a Tribute Page

2

the image selector is the issue since you are selecting with id, it should be #image or you can select with the tag img.

3

You also arent doing anything with max-width here

4

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