Tell us what’s happening:
Hi, so basically I am nearly done with my project but I keep getting this message " Your #image should be centered within its parent." . I don’t know how to solve this mistake so any help would be appreciated.
Thanks
Your code so far
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tribute to Queen Elizabeth II</title>
</head>
<main id="main">
<div id="heading" class="center">
<div class="header">
<h1 id="title" class="center">Queen Elizabeth II</h1>
</div>
<body>
<p class="font"><i>She was the UK’s longest reigning monarch. She succeeded her father to the throne at the age of just 25.
There was an outpouring of grief from all corners of the globe following news of the Queen's death on Thursday, September 8 2022.</i></p>
<figure id="img-div">
<img
id="image"
src="https://media.vogue.co.uk/photos/63281da54af94d00ad986b68/master/pass/Fc9-RcUXgAEgljY.jpeg"
alt="Last Portrait of Queen Elizabeth."
/>
<figcaption id="img-caption">
This was the last portrait of Queen Elizabeth before she died.
</figcaption>
</figure>
<section id="tribute-info">
<h2 id="headline">Here's a time line of Queen Elizabeth's life:</h3>
<ul>
<li><strong>1926</strong> - Born Princess Elizabeth Alexandra Mary in Mayfair, London, the first child of the future King George VI and Queen Elizabeth, later called the Queen Mother.</li>
<li>
<strong>1936</strong> - George V dies. Edward VIII becomes king.
</li>
<li>
<strong>1939</strong> - Britain declares war on Germany. Britain now it's part in WW2.
</li>
<li>
<strong>1947</strong> - Elizabeth marries Prince Philip Mountbatten of Greece and Denmark at Westminster Abbey.
</li>
<li>
<strong>1948</strong> - Prince Charles is born.
</li>
<li>
<strong>1952</strong> - Elizabeth becomes queen upon the death of her father George VI.
</li>
<li>
<strong>1969</strong> - Prince Charles is invested Prince of Wales. Lord Snowdon designs a new coronet for the occasion as the Duke of Windsor took the previous one with him to Paris.
</li>
<li>
<strong>1981</strong> - Charles and Diana marry in St Paul’s Cathedral, London.
</li>
<li>
<strong>1992</strong> - Windsor Castle is partly destroyed by fire.
</li>
<li>
<strong>1997</strong> - Diana dies in a car crash in Paris. The Queen stays in seclusion for several days, and is heavily criticised in the press for her silence. Then, on the eve of Diana’s funeral, she does a walkabout to meet mourners outside Buckingham Palace and gives a televised address, speaking “as your Queen and as a grandmother” and paying tribute to Diana. “She was an exceptional and gifted human being,” she said. “In good times and bad, she never lost her capacity to smile and laugh, nor to inspire others with her warmth and kindness.”
</li>
<li>
<strong>2002</strong> - Elizabeth marks 50 years of reign with her Golden Jubilee. The year also sees the deaths of Elizabeth’s mother and her sister, Margaret.
</li>
<li><strong>2007</strong> - Elizabeth becomes the longest-living British monarch, overtaking Victoria.</li>
<li>
<strong>2021</strong> - The Queen's husband died.
</li>
<li>
<strong>2022</strong> - Elizabeth becomes the first British monarch to reach a Platinum Jubilee, marking 70 years as sovereign.
</li>
<li>
<strong>2022</strong> - Elizabeth meets Boris Johnson and Liz Truss at her summer holiday home in Scotland to oversee the handover of power from the outgoing prime minister to his successor. Traditionally held at Buckingham Palace in London, the ceremonies were moved to Balmoral for the first time in the queen’s reign in light of her mobility problems.
</li>
<li><strong>Sept.8 2022</strong> -
Sept. 8, 2022: Elizabeth dies at Balmoral Castle in Scotland at age 96. Her eldest son becomes King Charles III..</li>
</ul>
<h3> If you are interested , you should read more about this incredible human being
on his
<a
id="tribute-link"
href="https://en.wikipedia.org/wiki/Elizabeth_II"
target="_blank"
>Wikipedia entry</a
>.
</h3>
</main>
</body>
MY CSS code:
header {
padding: 15px;
text-align: center;
background:#781207;
color: white;
font-size: 8px;
}
#title{
font-size: 200%;
width: 60vmax;
text-align: center;
margin-left: auto;
margin-right: auto;
}
#image {
max-width:100% ;
height: auto;
width:250px;
display: block;
border: 5.5px solid
black;
display: block;
margin: 0 auto;
}
#img-caption{
margin: 15px 0 5px 0;
text-align: center;
font-weight: 400;
}
body {
background-color: #ebdca2;
}
h3{
font-family: fantasy;
}
#tribute-info {
font-family: monospace;
}
#img-caption{
font-family: coursive;
}
Challenge: Tribute Page - Build a Tribute Page
Link to the challenge:
