Tribute Page - Build a Tribute Page

Hey there guys, I’m working on the tribute page project and there’s a particular error that’s frustrating me and I’ve tried fixing it multiple times and the error still isn’t going away.
This is the error : " Your #image should be centered within its parent."
My image is def centered, but I still don’t understand the issue

My code so far

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title id="title">Jesus Page</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <main id="main">
        <header id="header" class="header">
            <h1>
                Jesus Christ
            </h1>
            <p>The Man Who came to save everyone</p>
        </header>
        <figure id="img-div">
            <img src="https://i.pinimg.com/originals/a5/50/51/a55051bd8250fdb1d854ef5bb81d1569.jpg" alt="A picture of Jesus From the Chosen" id="image">
            <figcaption id="img-caption"><i>This image is a depiction of how Jesus Looked like from the TV series <strong>The Chosen</strong></i></figcaption>
        </figure>
        <section id="tribute-info">
            <h2>Here's a time-line of Jesus' Life</h2>
            <ul>
                <li><strong >Birth in Bethlehem</strong> - Matthew 1:18-25, Luke 2:1-20</li>
                <li><strong >Childhood</strong> - Matthew 2:1-23, Luke 2:21-52</li>
                <li><strong >Baptized</strong> - Matthew 3:13-17,Mark 1:9-11, Luke 3:21-22, John 1:29-34</li>
                <li><strong >Tempted In the Wilderness</strong> - Matthew 4:1-11, Mark 1:12-13,  Luke 4:1-13</li>
                <li><strong >Changes Water into Wine</strong> - John 2:1-11</li>
                <li><strong >Speaks With Nicodemus</strong> - John 2:1-11</li>
                <li><strong >Changes Water into Wine</strong> - John 3:1-21</li>
                <li><strong >Speaks with the Samaritan Woman</strong> - John 4:4-26</li>
                <li><strong >Heals a man with Leprosy</strong> - Matthew 8: 1-4, Mark 1:40-45, Luke 5:12-14</li>
                <li><strong >Heals a Paralyzed Man</strong> - Matthew 9:1-8, Mark 2:1-12, Luke 5:17-26</li>
                <li><strong >Heals the Centurion's Servant</strong> - Matthew 8:5-13, Luke 7:1-10</li>
                <li><strong >Raises a Widow's Son from the Dead</strong> - Luke 7:11-17</li>
                <li><strong >Anointed by a Forgiven Woman</strong> - 7:36-50</li>
                <li><strong >Calms the Storm</strong> - Matthewq 8:23-27, Mark 4:35-41, Luke 8:22-25</li>
                <li><strong >Casts out Demons</strong> - Matthew 8:28-34, Mark 5:1-20, Luke 8:26-29</li>
                <li><strong >Heals the Woman who Touched His Cloak</strong> - Matthew 9:20-22, Mark 5:25-34, Luke 8:34-48</li>
                <li><strong >Feeds the crowd of 5,000</strong> - Matthew 14:13-21, Mark 6:45-51, Luke 9:10-17, John 6:1-13</li>
                <li><strong >Walks on Water</strong> - Matthew 14:22-33, Mark 6:45-51, John 6:16-21</li>
                <li><strong >Peter's Confession of Christ</strong> - Matthew 16:13-20, Mark 8:27-20, Luke 9:18-22</li>
                <li><strong >Transfiguration</strong> - Matthew 17:1-8, Mark 9:2-8, Luke 9:28-36</li>
                <li><strong >Forgives the Woman Caught in Adultery</strong> - John 8:2-11</li>
                <li><strong >Visits with Mary and Martha</strong> - Luke 10:38-42</li>
                <li><strong >Heals a Man Born Blind</strong> - John 9:1-7</li>
                <li><strong >Raises Lazarus from the Dead</strong> - John 11:1-44</li>
                <li><strong >Heals Ten people with Leprosy</strong> - Luke 17:11-19</li>
                <li><strong >Speaks with the Rich Young Man</strong> - Matthew 19:16-30, Mark 10:17-31, Luke 18:18-30</li>
                <li><strong >Zacchaeus The Tax Collector</strong> - Luke 19:1-10</li>
                <li><strong >Palm Sunday</strong> - Matthew 21:1-11, Mark 11:1-10, Luke 19:28-38, John 12:12-15</li>
                <li><strong >Clears the Temple</strong> - Matthew 21:12-13, Mark 11:15-17, Luke 19:45-46</li>
                <li><strong >The Last Supper</strong> - Matthew 26:17-30, Mark 14:12-26, Luke 22:7-38, John 13: 1-30</li>
                <li><strong >In the Garden of Gethsemane</strong> - Matthew 26:36-56, Mark 14:32-50, Luke 22:28-53, John 18:1-11</li>
                <li><strong >Suffers and Dies on the Cross</strong> - Matthew 27:26-50, Mark 15:16-37, Luke 22:63-23:46, John 19:1-30</li>
                <li><strong >Resurrection and Ascension</strong> - Matthew 28:1-20, Mark 16:1-19, Luke 24:1-53, John 20:1-28 </li>
            </ul>
        </section>
        <h3 id="tribute">
            If you know you've treaded from the right Path and you're in need of Salvation, then pick up a Bible close to you or read this <strong><a href="https://www.bible.com/bible/111/GEN.1.NIV" id="tribute-link" target="_blank">Online Bible</a></strong>
        </h3>
    </main>
</body>
</html>

CSS

* {
   
    
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    padding: 10px;
}
main {
    background-color: #92A1A8;
}
.header {
    text-align: center;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: large;
}
 #image {
    max-width: 100%;
    display: block;
    height: auto;
    width: 500px;
    margin: auto; 

}
#img-div {
    background-color:#202529;
    margin: 0 auto;
    width: 100%;
}
#img-caption {
    text-align: center;
    color: white;
}
#tribute-info
{
    margin: 0 auto;
    display: table;
    justify-content: space-between;
}
#footer {
    text-align: center;
    font-size: large;
}

I don’t know what I’m doing wrong
Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

Hi there! Welcome to the community.

Remove the padding attribute from the * section in your CSS. It’s adding additional spacing to every element which causes the image, and a few other elements, to be pushed off center.

3 Likes

Thank You @melockwood94 the solution you provided Worked!
Thanks Once again!

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