Tribute Page - Build a Tribute Page

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Your img element should have a display of block .
Your #image should have a max-width of 100% .
Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link rel="stylesheet" href="style.css">
   <title id="title">Nature</title>
</head>
<body>
  <main id="main">
   <div id="img-div">
      <img src="https://images.unsplash.com/photo-1485780974122-c91bb5dcf725?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1yZWxhdGVkfDE4fHx8ZW58MHx8fHx8&w=1000&q=80" alt="Nature" id="image"><div id="img-caption">
     A dark blue sky over the ocean at night
   </div>
   
   <div id="tribute-info">Tribute to my past self</div>
   <a href="https://www.google.com/url?sa=i&url=https%3A%2F%2Fthe-boxer.fandom.com%2Fwiki%2FChapter_30&psig=AOvVaw3sqtLDtCvOxMdon2UEEfvt&ust=1692897079458000&source=images&cd=vfe&opi=89978449&ved=0CBAQjRxqFwoTCKjhi5uj84ADFQAAAAAdAAAAABAM" id="tribute-link" target="_blank"></a>
   </div>
</main>
</body>
</html>

/* file: styles.css */
#image {
   display: block;
   max-width: 100%;
   height: auto;
   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/116.0.0.0 Safari/537.36

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

2

Your issue is here

You need to use the correct file name

3

yes, that this is what happens when you use VS Code and paste the code from there.

4

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