Tell us what’s happening:
What is wrong with my code?
Here is the test case status.
-
Failed:Your
imgelement should have adisplayofblock. -
Failed:Your
#imageshould have amax-widthof100%. -
Passed:Your
#imageshould have aheightofauto. -
Failed:Your
#imageshould be centered within its parent.**Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Tribute Page project" />
<title>Mahatma Gandhi</title>
<link rel="stylesheet" href="stylesTribute.css" />
</head>
<body>
<main id="main">
<header>
<h1 id="title">Mahatma Gandhi</h1>
<p>First they ignore you, then they laugh at you, then they fight you, then you win.</p>
</header>
<div id="img-div">
<img id="image" src="https://i.ytimg.com/vi/VbCoBVkekRk/maxresdefault.jpg"" alt="Mohandas Karamchand Gandhi">
<figcaption id="img-caption">Picture of Mohandas Karamchand Gandhi</figcaption>
<p>Mohandas Karamchand Gandhi (2 October 1869-30 January 1948), commonly known as Bapu, was an Indian lawyer, anti-colonial nationalist and political ethicist who employed nonviolent resistance to lead the successful campaign for India's independence from British rule,and to later inspire movements for civil rights and freedom across the world. The honorific prefix Mahātmā (Sanskrit: "great-souled", "venerable"), first applied to him in 1914 in South Africa, is now used throughout the world.</p>
</div>
<div id="tribute-info">
<h3>Mohandas Karamchand Gandhi (2 October 1869 - 30 January 1948)</h3>
<h4>Here's a timeline of this great soul</h4>
<ul>
<li><span>October 2, 1869:</span>Birth of Mohandas Karamchand Gandhi.</li>
<li><span>September 4, 1888:</span>Gandhi leaves for England to study law.</li>
<li><span>October 1899:</span>Outbreak of Boer War (1899-1901) in South Africa. Gandhi organizes an ambulance corps for the British.
Gandhi returns to India to attend the Indian National Congress. G.K. Gokhale introduces him to nationalist leaders.</li>
<li><span>July 31, 1907:</span>The Boer Republic Transvaal, now under the control of the British, attempts to register all Indians as members; Gandhi and others refuse to register. Their resistance efforts mark the first use of nonviolent non-cooperation by the Indian minority in South Africa, soon calledsatyagraha, or "soul-force."</li>
<li><span>January 11, 1908:</span>Gandhi is arrested and sentenced to two months in prison.</li>
<li><span>August 15, 1947:</span>Indian independence becomes official, as does the partition into two countries, India and Pakistan.</li>
<li><span>August-December 1948:</span>India dissolves into chaos and killings, as Hindus and Muslims flee for the borders of India and Pakistan.</li>
<li><span>January 30, 1948:</span>Gandhi is assassinated by Nathuram Vinayuk Godse, a Hindu nationalist.</li>
</ul>
</div>
<footer><p>Browse for more info on <a id="tribute-link"href="https://en.wikipedia.org/wiki/Mahatma_Gandhi" target="_blank">Mahatma-Gandhi</a></p></footer>
</main>
</body>
</html>
/* file: styles.css */
body{
margin: 20px 20px;;
color: #333;
font-family: sans-serif,monospace;
}
main{
padding-top: 5px;
padding-bottom: 5px;
background-color:lightgray;
}
header {
width: 100%;
display: inline-block;
justify-content: center;
align-items: center;
margin: 10px;
}
h1{
font-weight: 800;
color: darkslategray;
text-align: center;
}
header > p{
text-align: center;
}
img{
display:block;
}
#image{
max-width: 100%;
height: auto;
margin:0 auto;
}
#img-div {
width: 70%;
margin: auto;
padding: 20px;
background-color: white;
font-family: monospace;
}
#img-caption{
font-size: 0.75rem;
text-align: center;
}
@media (max-width:460px) {
#img-caption{
font-size: 0.5rem;
}
}
#img-div > p{
text-align:justify;
}
ul{
max-width: 70%;
margin: 0 auto 50px auto;
text-align: left;
font-size: 0.9rem;
line-height:30px;
font-family: monospace;
}
span{
font-weight: 700;
}
h3,h4{
text-align: center;
color: #414350;
}
footer{
text-align: center;
font-size: 12px;
}
a::before{
color: #477ca7;
}
a:visited{
color: darkred;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.5112.81 Safari/537.36 Edg/104.0.1293.47
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge: