Hello friends! I finished a tribute page from one of theassignments on freecodecamp.org. It passed all tests, except these three:
Your img element should have a display of block .
Your #image should have a max-width of 100% .
Your #image should be centered within its parent.
I tried to find the reason for two hours, but I can’t find anything wrong.
I would be very thankful if you could help me.
My HTML so far:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Koulen&display=swap" rel="stylesheet">
</head>
<body>
<main id="main">
<h1 id="title">Aaron Swartz</h1>
<h4>Hero of the internet</h4>
<div id="img-div">
<img id="image" src="https://www.rollingstone.com/wp-content/uploads/2018/06/rs-19823-20130213-aaron-swartz-624x420-1360787689.jpg?resize=1800,1200&w=1200">
<figcaption id="img-caption">Aaron Swartz at 2009 Boston Wikipedia Meetup</figcaption>
</div>
<h3>The life of Aaron</h3>
<ul id="tribute-info">
<li>Born on November 8th 1986 in Illinois.</li>
<li>In 1999, at age 12, he created the website "The Info Network", a user-generated encyclopedia.</li>
<li>Started studying at Stanford in 2005.</li>
<li>In 2005 he created the web.py framework for the startup Infogami, a CMS.</li>
<li>Created Reddit, one of the most visited websites in the world.</li>
<li>In 2008, Swartz founded Watchdog.net, "the good government site with teeth," to aggregate and visualize data about politicians.</li>
<li>Swartz downloaded about 2.7 million federal court documents, in 2007, stored in the PACER (Public Access to Court Electronic Records) database.</li>
<li>In 2009, wanting to learn about effective activism, Swartz helped launch the Progressive Change Campaign Committee.</li>
<li>In 2010, Swartz co-founded Demand Progress, a political advocacy group that organizes people online to "take action by contacting Congress and other leaders, funding pressure tactics, and spreading the word" about civil liberties, government reform, and other issues.</li>
<li>Swartz was involved in the campaign to prevent passage of the Stop Online Piracy Act (SOPA).</li>
<li>According to state and federal authorities, Swartz used JSTOR, a digital repository, to download a large number of academic journal articles through MIT's computer network over the course of a few weeks in late 2010 and early 2011</li>
<li>On the night of January 6, 2011, Swartz was arrested near the Harvard campus by MIT police and a Secret Service agent, and arraigned in Cambridge District Court on two state charges of breaking and entering with intent to commit a felony.</li>
<li>On July 11, 2011, he was indicted by a federal grand jury on charges of wire fraud, computer fraud, unlawfully obtaining information from a protected computer, and recklessly damaging a protected computer.</li>
<li>Swartz died by suicide on January 11, 2013.</li>
<li>Swartz's funeral services were held on January 15, 2013, at Central Avenue Synagogue in Highland Park, Illinois. Tim Berners-Lee, creator of the World Wide Web, delivered a eulogy.</li>
</ul>
<h2><a href="https://en.wikipedia.org/wiki/Aaron_Swartz" id="tribute-link" target="_blank">Read more on Wikipedia</a></h2>
</main>
</body>
</html>
My CSS so far:
*{
font-family: 'Koulen', cursive;
}
body{
background-color: #EEEEEE;
}
#main{
text-align: center;
border-radius: 15px;
background-color: white;
width: 90%;
margin-left: auto;
margin-right: auto;
}
#tribute-info{
text-align: left;
max-width: 80%;
margin-left: auto;
margin-right: auto
}
#image{
height: auto;
max-width: 100%;
margin-left: auto;
margin-right: auto;
display: block;
}
Browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.54 Safari/537.36
Challenge: Build a Tribute Page
Link to the challenge: