I am very confused as to how I am not passing tests 16 ( Your img element should have a display of block ) and 17 ( Your #image should have a max-width of 100% .) on the tribute page certification project as both styles are included in the part of the code concerning the img element. Any attempt to change it also causes the code to fail the last test ( Your #image should be centered within its parent.). If I revert back to the original or remove the fixes this test stays failed. How can I make the code pass.
**Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
<title>A tribute page to Jesus</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<meta name="description" content="A page glorifying god">
<meta name="keywords" content="Jesus, Cross, Bossman">
<meta name="author" content="Gingerninja412">
<link rel="stylesheet" href="Styles.css">
</head>
<body>
<main id="main">
<div id="title-element">
<h1 id="title">Jesus; god among men</h1>
<h3 id="title-sub">The man who died for the world</h3>
</div>
<div id="img-div">
<figure>
<img id="image" src="jesus%20image.jpg" alt="An image of jesus on the cross">
<figcaption id="img-caption">A picture of Jesus on the cross where he died for our sins</figcaption>
</figure>
</div>
<div id="extra-info">
<p>A list of miracles that Jesus worked:</p>
<ul id="tribute-info">
<li>Raised himself from the dead</li>
<li>Fed the 5000 (and women and children)</li>
<li>Healed the leper</li>
<li>Made the blind see</li>
<li>Made the lame walk</li>
<li>Ascended to Heaven</li>
</ul>
</div>
<div id="tribute-reference">
<p><a id="tribute-link" target="_blank" href="https://www.biblegateway.com/">find out more here</a></p>
</div>
</main>
</body>
</html>
/* file: styles.css */
@font-face{
font-family: title-text;
src: url(Livingst.ttf);
}
#title-element{
text-align: center;
background-color: antiquewhite;
color: #f0a80c;
border-top: 10px solid;
border-bottom: 10px solid;
border-color: red
}
#title{
font-family: title-text;
text-align: center;
}
#image{
display: block;
height: auto;
margin: 0 auto;
}
figcaption{
text-align: center;
font-size: 2rem;
}
p{
text-align: center;
font-size: 1.5rem;
}
#tribute-info{
text-align: left;
font-size: 1.25rem;
margin-left: 40%;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge: