Tell us what’s happening:
Describe your issue in detail here.
-
Failed:Your
img
element should have adisplay
ofblock
. -
Failed:Your
#image
should have amax-width
of100%
.
I am getting stuck here
thanks you
Your code so far
<!-- file: index.html -->
<style>
body
{
background-color: black;
color: white;
font-family: calibri;
}
</style>
<main id="main">
<div id="main">
<h1 id="title">Dr. Norman Borlaug"</h1>
<div id="img-div">
<a id="tribute-link" href="https://en.wikipedia.org/wiki/Norman_Borlaug" target="_blank">
<img id="image" src="data:image/jpeg;base64,/9H/AAP/" alt="picture of "Dr. Norman Borlaug"></a>
<figcaption id="img-caption">Dr. Norman Borlaug</figcaption>
</div>
<p id="tribute-info">norman ernest borlaug</p>
<b>norman ernest</b>
<ul>
<li>1</li>
<li>2</li>
</ul>
</div>
</main>
/* file: styles.css */
#image
{
max-width: 100%;
height: auto;
display: block;
}
#img-caption
{
width: 400px;
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 Safari/605.1.15
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge: