Tribute Page - Build a Tribute Page

Tell us what’s happening:
How can i achieve this css code:

  1. how to center the #image within its parent
  2. img set to a max-width of 100% and display in block

I have tried the best i can.

   **Your code so far**
/* file: index.html */
<!DOCTYPE html>
   <link rel="stylesheet" href="stlyes.css" />
   <main id="main">
     <h1 id="title">
       Sgt. Joseph Aboh
       A Nigerian Police officer in thedepartment of rank and file.
<figure id="img-div">
<img src="" alt="Sgt. Joseph Aboh seen standing in the office at Zone 4 Headquarter Makurdi" id="image"/>
<figcaption id="img-caption">
 Sgt. Joseph Aboh third from the right, trains new police recruit on how to be organise in offcie, at the Zone4 police Headquarter Makurdi of Benue state
<section id="tribute-info">
<h3 id="Headline">Here is a time line of Sgt. Joseph Aboh's life:</h3>
         <li><strong>1945</strong> - Born in Tion-Kwase Mbakya, Katsian-ALa</li>
           <strong>1955</strong> - Leaves his family's farm to attend the
           Primary school at Hagaa
           <strong>1961</strong> - Has to leave home to join the Nigerian police college
           <strong>1962</strong> - Finishes from the college and took a Job with the Nigerian Police force
           <strong>1985</strong> - Marries wife of 25 years RoseMary Akpough.
           <strong>1986</strong> - gives birth to his first born name Terhile 
           <strong>1990</strong> - the lord bless his family with yet another male child name Terngu Francis.
         <li><strong>2002</strong> - dies at the age of 57.</li>
           "Joseph's life and achievement are testimony to the far-reaching
           contribution that one man's towering intellect, persistence and
            vision can make to human peace and progress."
         <cite>-- Nigerian Prime Minister Iho Mzenda</cite>
         If you have time, you should read more about this incredible human
         being on his
           >Wikipedia entry</a
/* file: styles.css */
html {
 font-size: 10px;
body {
 font-family: Roboto, Arial;
 font-size: 1.6rem;
 line-height: 1.5;
 text-align: center;
 color: #333;
 margin: 0;
h1 {
 font-size: 4rem;
 margin-bottom: 0;

h2 {
 font-size: 3.25rem;
 color: #477ca7;
a:visited: {
 color: #74638f;
#main {
 margin: 30px 8px;
 padding: 15px;
 border-radius: 5px;
 background: #eee;
 display: block;
 margin-block-start: 1em;
 margin-block-end: 1em;
 margin-inline-start: 40px;
 margin-inline-end: 40px;

#img-div {
background: white;
padding: 10px;
margin: 0;
img {
 max-width: 100%;
 display: block;
 height: auto;
 margin: 0 auto;

#img-caption {
 margin: 15px 0 5px 0;

#headline {
 margin: 50px 0;
 text-align: center;

ul {
 max-width: 550px;
 margin: 0 auto 50px auto;
 text-align: left;
 line-height: 1.6;

li {
 margin: 16px 0;

blockquote {
 font-style: italic;
 max-width: 545px;
 margin: 0 auto 50px auto;
 text-align: left;
img {
   padding: 12px;
		margin: 10px;
		align-content: center;
		max-width: 100%;
		display: block;

   **Your browser information:**

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

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

You have a spelling error here

Also it looks like you have two sets of styles for the same img element.

Here is the first set

and here is the second set

You need to get rid of that second set of styles then the test will pass.

wow thanks a million times

i’m really grateful, you have given a quantum leap

I’m happy to help :slight_smile:

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