Tribute Page - Build a Tribute Page , running the test on img

hi,
can you please tell me why do i get error by the test that my img display is not block, my #image doesn’t have a max-width of 100%, and my image is not centered within its parent !!!
it literally is …

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">
    <title>Document</title>
    <link rel="stylesheet" href="tribute.css">
</head>
<body>
    <main id="main">
        <header>
            <h1 id="title">Ada Lovelace</h1>
            <p>The First Computer Programmer</p>
        </header>
        <figure id="img-div">
                <img id="image" src="Ada.jpeg" alt="Portrait of Ada" >
                <figcaption id="img-caption">Portrait of Ada by British painter Margaret Sarah Carpenter (1836)</figcaption>
        </figure>
        
        <div id="tribute-info">
            <p>Augusta Ada King, Countess of Lovelace (née Byron; 10 December 1815 – 27 November 1852) was an English mathematician and writer, chiefly known for her work on Charles Babbage's proposed mechanical general-purpose computer, the Analytical Engine. She was the first to recognise that the machine had applications beyond pure calculation.
                Lovelace died at the age of 36 on 27 November 1852,[43] from uterine cancer.[44] The illness lasted several months, in which time Annabella took command over whom Ada saw, and excluded all of her friends and confidants. Under her mother's influence, Ada had a religious transformation and was coaxed into repenting of her previous conduct and making Annabella her executor.[45] She lost contact with her husband after confessing something to him on 30 August which caused him to abandon her bedside. It is not known what she told him.[46] She was buried, at her request, next to her father at the Church of St. Mary Magdalene in Hucknall, Nottinghamshire. A memorial plaque, written in Latin, to her and her father is in the chapel attached to Horsley Towers.
            </p>
            <a id="tribute-link" href="https://en.wikipedia.org/wiki/Ada_Lovelace" target="_blank">Read More</a>
        </div>


        


    </main>
</body>
</html>

/* file: styles.css */
body {
    font-family: serif;
    text-align: center;
    background: #afecd2;
}
main {
    margin: 15px;
    padding: 15px;
    border-radius: 5px;
    background: #7dac98;
}
#title {
    color: #183026;
}
#img-div {
    display: block;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}

#img-caption {
    padding: 15px;
    display: block;
}
#tribute-info>p {
    margin: auto 30px auto 30px;
    text-align: justify;
}
#tribute-link {
    margin: 30px 30px 30px 30px;
    padding: 30px 30px 30px 30px;
    display: block;
    color: #183026;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.0.0 Safari/537.36 Edg/116.0.1938.76

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

This isn’t correct.

Note: Be sure to add <link rel="stylesheet" href="styles.css"> in your HTML to link your stylesheet and apply your CSS”

If you want to centered your image element, you should use these code in img element;
img{
display:block;
margin: 0 auto;
}.
And also change your link href text to styles.css because when you see to the top of your css page it shows that this css page has styles.css name.

1 Like

oh my god, silly me
i forgot to change the name of the file, that was the name of the file on my system!!!
thanks

1 Like

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