Tell us what’s happening:
Describe your issue in detail here.
I need help with this challenge I don’t know where I missed missed the point.
Your #img-caption should be a descendant of #img-div .
Your code so far
<!-- file: index.html -->
<DOCTYPE html>
<html lang="en"></html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible">
<meta name="viewport">
<title>Dr Goshen</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main id="main">
<h1 id="title">Dr Goshen</h1>
<h3>
An African Canadian who is passionate and obssed with the idea of becoming a medical doctor.
</h3>
<div class="img-container" id="img-div">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcStGB15gaSJOK8-W7rFzEFfdTr__yg8zExjAA&usqp=CAU"
alt="Goshen"
class="zack-image"
id="image"/>
</div>
<div class="caption" id="img-caption">
Goshen started his tertiary education in 2020, he began with health science then when he will reach in Canada he's going to proceed with his career.
</div>
<div class="life">
<p class="life-header bold">Here is the timeline of Goshen's life</p>
<ul id="tribute-info">
<li><span class="bold">Started nusery in 2005</span></li>
<li><span class="bold">Started his primary school in 2005 and finished in 2011</span></li>
<li><span class="bold">He did his 7th grade in Congo in 2012 while in 2013 he dropped from school due to some circumstances.</span></li>
<li><span class="bold">In 2014 Goshen moved in Zambia where he was enrolled as a refugee</span></li>
<li><span class="bold">In 2015 Goshen resumed his secondary Education and in 2019 he completed high-school and passed with flying colors</span></li>
<li><span class="bold">In 2020 Goshen received a scholarship at the University of the people</span></li>
<li><span class="bold">Goshen is currently in Zambia but will soon move to Canada</span></li>
</ul>
<div class="quote-container">
<p class="quote">Do as many things as possible but do not get confused</p>
<p class="quote-author">Goshen</p>
</div>
</div>
<h3>If you have time, you should read more specimen on his
<a id="tribute-link" href="https://zm.linkedin.com/in/goshen-zk-2225111ab" target="_blank">Linkedin Page</a></h3>
</body>
/* file: styles.css */
*{
padding: 0;
margin: 0;
}
h1{
padding: 20px;
margin: 10px;
}
h3{
font-size: 20px;
background-color: #13151f;
margin: 20px;
padding: 10px;
border-radius: 10px;
}
body{
background-color: #03050f;
color: white;
font-family: apple-sytem, Cantarell, "Open Sans", BlinkMacSy, Ubuntu;
text-align: center;
}
.img-container{
margin: auto;
padding: 30px;
background-color: #003;
}
.zack-image{
objective-fit: contain;
border-radius: 10px;
max-width: 100%;
display: block;
height: auto;
margin: auto;
}
.caption{
padding: 5px;
}
.life{
text-align: left;
font-size: 20px;
font-family: Arial;
padding: 30px 70px;
max-width: 600px;
margin: 10px;
background-color: #002;
}
.life-header{
text-align: center;
font-size: 20px;
font-family: Arial;
padding: 30px;
}
.bold{
font-weight: bold;
}
li{
margin: 20px;
}
.quote{
margin: 30px 30px 5px;
font-style: italic;
}
.quote-author{
text-indent: 30px;
}
a{
color:#99f;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge:
