Tribute Page - Build a Tribute Page

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

  • Failed:Your #image should be centered within its parent.

Your code so far

<!-- file: index.html -->
<main id="main">
  <title id="title">Dr. Norman Borlaug</title>
    <div id="img-div">
      
        <img id="image"></img>
      
      
      <div id="tribute-info">Tribute to Norman Borlaug</div>
    <a href="" target="_blank" id="tribute-link"></a>
      <div id="img-caption">Caption: Saved a bilion lives</div>
      </div>
    <link rel="stylesheet" href="styles.css">
</main>

/* file: styles.css */
img > div {
  max-width: 100%;
  height: auto;
  display: block;
  text-align: center;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.3 Safari/605.1.15

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

2

Welcome to our community!

  • <title id="title">Dr. Norman Borlaug</title>
    this HTML element goes within the ‘head’ element

  • <link rel="stylesheet" href="styles.css">
    this HTML element goes within the ‘head’ element

  • img > div
    this is not possible to have a div element within the ‘img’ element. An ‘img’ element is self-closing, which means it doesn’t have the closing </img> tag

3

Please assist I am having thesame issue

type or paste code here .img{display:block;
margin: auto;}
image{max-width:100%;}
{height: auto;}
4

thanks. I have solved it.

5

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