Tell us what’s happening: I am having trouble centering the image in it’s parent. I have the margin set to 0 auto and the image appears centered in both the small preview and the preview page. Refer to the img link with the id=‘image’ and the #image selector in the CSS section. Thanks!
Your code so far
WARNING
The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.
You will need to take an additional step here so the code you wrote presents in an easy to read format.
Please copy/paste all the editor code showing in the challenge from where you just linked.
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' href='styles.css'>
<title id='title'>Harriet Tubman</title>
</head>
<body>
<header id='header'>
<div class='header' id='header-div'>
<h1 id='page-title'>Harriet Tubman</h1>
<div>
</header>
<main id='main'>
<div id='img-div'>
<img id='image' src='https://cdn.kpbs.org/dims4/default/f0658b2/2147483647/strip/true/crop/1000x563+0+22/resize/1200x675!/quality/90/?url=http%3A%2F%2Fkpbs-brightspot.s3.amazonaws.com%2F20%2F2d%2Fd5b6c682474c9bd5a1f6555e97e9%2Fm-ht10007-ala-tr9jrt.jpg' alt='Harriet Tubman portrait'>
<figcaption id='img-caption'>Harriet Tubman: American hero</figcation>
</div>
<div id='tribute-info'>
<h2 id='life-title'><u>Just a <em>few</em> of her Accomplishments</u></h2>
<ul id='tribute-info-list'>
<li>On <b>September 17, 1849</b>, Harriet Tubman escaped enslavement, for the first time, with her brothers Ben and Henry. Unfortunately, her brothers, for fear of the consequences, convinced her to go back with them.</li>
<li>Later in <b>1849</b>, Harriet Tubman escaped enslavement again, alone this time.</li>
<li>With assistance by the Underground Railroad, she made the <b>90 mile</b> journey <em>by foot</em> from Maryland to Pennsylvania.</li>
<li>Between <b>1851-1862</b>, Harriet Tubman lead over <b>70</b> enslaved individuals to safely across the border into Canada.</li>
<li>In <b>1859</b>, Tubman was able to purchase a plot of land in the outskirts of <b>Aubrun, New York</b>. She used this land as a safe haven for family and friends as well as many black americans looking for a better and free life in the north.</li>
<li>In <b>1861</b>, Tubman joined the Union's civil war effors.</li>
<ul id='tribute-info-list' class='indent'><li>From <b>1861-1863</b>, she served as a nurse at <u>Port Royal</u>, in South Carolina, providing herbal remedies to assist soldiers suffering from <em>dysentary</em>. She also worked to aid men with <em>smallpox</em> and yet never contracted it herself, which many attributed to a blessing from God.</li>
<li>In <b>1863</b>, Tubman lead a scouting group through the land around <u>Port Royal</u> on a reconnaissance mission for the <u>Secretary of War</u>, Edwin Stanton. Thanks to her knowledge of covert travel and subterfuge among potential enemies, her group successfully mapped the unfamiliar terrain and gathered information on the people who lived there.</li>
<li>She provided Colonel James Montgomery with key intelligence that aided in the capture of <b>Jacksonville, Florida</b>.</li>
<li>In <b>1863</b>, Harriet Tubman became the <em>first</em> woman to lead an armed assult during the civil war. She guided three steamboats around Confederate mines in the waters leading to the shore of the <b>Combahee River</b>. Once ashore, the Union troops set fire to the plantations, destroying infrastructure and seizing thousands of dollars worth of food and supplies. When the steamboats sounded their whistles, enslaved people throughout the area understood that they were being liberated. More than <b>750</b> enslaved people were rescued in the <u>Combahee River Raid</u>.</li>
</ul>
<li id="last-item">In <b>1896</b>, Tubman was the keynote speaker at the first meeting of the <u>National Federation of Afro-American Women</u>. </li>
</ul>
<h3>For more indepth information on Harriet Tubman, please visit her <a id='tribute-link' href='https://en.wikipedia.org/wiki/Harriet_Tubman#CITEREFLarson2004' target='_blank'>wikipedia page</a>.
</div>
</main>
</body>
</html>
body {Background-color: #F0EAD6; display: flex; flex-wrap: wrap; margin:0; padding: 1em 1em 1em .5em;}
#img-div { width: 100%; margin: 0 auto; padding-bottom: 20px}
#image { display: block; max-width: 100%;width: 100%; height: auto; margin: 0 auto; padding: 0; border-radius: 10px; border: 4px solid #1B0000;}
h1 {width: 100%; text-align: center; margin: 0 ; padding: 0; justify-content: center; color: #F0EAD6 }
header { margin: 0 auto; padding: 1em; width: 100%; height: 50px; max-width: 300px;}
.header {background-color: #1B0000; margin: 0; padding: 5px; width: 100%; postion: fixed; top: 0; display: flex; justify-content: center; margin-left: -5px; border: solid #1B0000; border-radius: 10px}
figcaption {color: #1B0000; font-weight: bold; text-align: center; }
#tribute-info {background-color: #1B0000; border: 5px solid #1B0000; border-radius: 10px; }
#tribute-info-list {color: #F0EAD6; margin: 0 8px 15px -15px;}
h2,h3 {text-align: center; color: #F0EAD6;}
#last-item {margin-top: -12px;}
#tribute-link {color: #F0EAD6;}
#tribute-link:hover {color: #1B0000; background-color:#F0EAD6;}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge:
