Tell us what’s happening:
I am unsure how to center the image within it’s parent element. " Your #image should be centered within its parent." I tried looking it up but still couldn’t figure it out. I think I have to do something with the img-div but unsure what.
**Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head id="head">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, intial scale=1">
<link rel="stylesheet" href="styles.css">
<title>Tribute Page</title>
</head>
<body>
<header class="header">
<h1 id="title">SASUKE UCHIHA</h1>
<p>The Last of the Uchiha</p>
</header>
<main id="main">
<div class="img-div" id="img-div">
<img src ="https://cdn.discordapp.com/attachments/616769694250041364/1010921990477074452/ds.png" alt="Sasuke leaning" id="image">
</div>
<div class="caption" id="img-caption">Sasuke drawn by Masashi Kishimoto.</div>
<div id="tribute-info" class="tribute">
<p><a id="tribute-link" target="_blank" href="https://www.youtube.com/watch?v=KK8rFN6KGzc">Sasuke Uchiha</a> (うちはサスケ, Uchiha Sasuke) is one of the last surviving members of Konohagakure's Uchiha clan. After his older brother, Itachi, slaughtered their clan, Sasuke made it his mission in life to avenge them by killing Itachi. He is added to Team 7 upon becoming a ninja and, through competition with his rival and best friend, Naruto Uzumaki, Sasuke starts developing his skills.</p>
<p class="divider"></p>
<p>
Dissatisfied with his progress, he defects from Konoha so that he can acquire the strength needed to exact his revenge. His years of seeking vengeance and his actions that followed become increasingly demanding, irrational and isolates him from others, leading him to be branded as an international criminal. After learning the truth of his brother's sacrifice, later proving instrumental in ending the Fourth Shinobi World War, and being happily redeemed by Naruto, Sasuke decides to return to Konoha and dedicate his life to help protect the village and its inhabitants, becoming referred to as the "Supporting Kage" (支う影, Sasaukage, literally meaning: Supporting Shadow).
</p>
</div>
</main>
<footer id="footer">
</footer>
</body>
</html>
/* file: styles.css */
body {
font-family: monospace, Tahoma;
background-color: #dbcaea;
}
img {
display: block;
height: auto;
max-width: 100%;
padding: 0 40px;
margin: 0 auto;
background-color: #524570;
}
header {
padding: 10px;
display: block;
margin: 0 auto;
text-align: center;
background-color: #524570;
color: #dbcaea;
font-style:
}
header p {
display: block;
color: #180d2b;
font-size: 18px;
padding-top: 0;
margin-top: 0;
font-style: oblique;
}
.caption {
background-color: #524570;
max-width: 620px;
display: block;
margin: 0 auto;
color: #dbcaea;
text-align: center;
}
.tribute {
padding: 100px;
background-color: #dbcaea;
}
.divider {
padding: 10px;
}
.tribute p {
margin: 0 auto;
color: #180d2b;
}
h1 {
font-size: 38px;
font-family: ui-monospace;
padding: 0;
border: 0;
margin-bottom: 0
}
.tribute a {
color: #4d6d9c;
}
a:hover {
color: #8b98c2;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge: