Tell us what’s happening:
Describe your issue in detail here.
how to center image within the parent element?
Your code so far
/* file: index.html */
<html>
<header>
<title>My page</title>
<link rel="stylesheet" href="styles.css">
</header>
<body>
<main id="main">
<div id="title">Dr. Norman Borlaug</div>
<div id="img-div">
<figcaption id="img-caption">Image</figcaption>
<img id="image" src="desktop/DrNorman.jpeg" alt="image">
</div>
</div>
<div id="tribute-info">Dr. Norman Borlaug who saved abillion lives</div>
<a id="tribute-link" href=" https://tribute-page.freecodecamp.rocks" target="_blank"></a>
</main>
</body>
</html>
/* file: styles.css */
#main{
}
#image{
max-width: 100%;
height: auto;
}
img{
display: block;
}
#title{
text-align: center;
font-weight: bold;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.54 Safari/537.36
Challenge: Build a Tribute Page
Link to the challenge:
