Tell us what’s happening:
Describe your issue in detail here.
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html>
<head>
<title>Tribute Page</title>
</head>
<body>
<main id="main">
<h1 id="title">Dr. Norman Borlaug</h1>
<figure id="img-div">
<img
id="image"
src="https://c2.staticflickr.com/4/3689/10613180113_fdf7bcd316_b.jpg"
alt="Dr. Norman Borlaug"
/>
<figcaption id="img-caption">
Dr. Norman Borlaug, founder of the World Food Prize.
</figcaption>
</figure>
<div id="tribute-info">
<p>
Dr. Norman Borlaug (1914-2009) was an American agronomist who led
initiatives worldwide that contributed to the extensive increases in
agricultural production termed the Green Revolution. He was awarded
the Nobel Peace Prize in 1970 in recognition of his contributions to
world peace through increasing food supply.
</p>
</div>
<a
id="tribute-link"
href="https://en.wikipedia.org/wiki/Norman_Borlaug"
target="_blank"
>Learn more about Dr. Norman Borlaug</a
>
</main>
</body>
</html>
/* file: styles.css */
#main {
display: flex;
flex-direction: column;
align-items: center;
}
#title {
font-size: 2rem;
margin-top: 1rem;
}
#img-div {
margin-top: 1rem;
}
#image {
display: block;
max-width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
align-items: center;
}
#img-caption {
text-align: center;
font-style: italic;
}
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: Responsive Web Design Projects - Build a Tribute Page
Link to the challenge: