My #image should be centered within its parent? cant seem to pass or not working

ive tried so many times and so many different ways for it to work but i still cant figure it out. its kind of a mess but please help me. everything ive seen says to put margin: 0 auto in the img style code, but that isnt working. this is what ive got for that part.

html:


<main id="main">
  <head><link rel="stylesheet" href="styles.css">
  <link href="https://fonts.googleapis.com/css2?family=Nosifer&family=Oswald&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="style.css">
  <h1 id="title"> H.P Lovecraft</h1>
  <p><strong>unrecognised in his own life time</strong></p>
    <figure id="img-div">
          <div><img id="image" src="https://pbs.twimg.com/profile_images/1507422762784145447/HmNIgtE8_400x400.jpg"
                    alt="Fan art of H.P Lovecraft designed with his own horror monsters such as cthulhu."/></div>
   <figcaption id=img-caption>
     H.P lovecraft surround by his demons and monsters he had wrote about, such as Cthulhu (Elder-god)
      </figcaption>
  </figure>
<section id="tribute-info">
  <h2 id="headline"> Timeline of H.P Lovecraft</h2>
    <ul>
      <li><strong>1890</strong>-on Aug 20th Howard Philips Lovecraft was born</li>
      <li><strong>1911-1914</strong>-Lovecraft starts a series of critical letters to magazine authors that eventually earns him the notice of the editor who gives him a job.</li>
      <li><strong>1912</strong>-First Non-Self Published Poem, "Providence in 2000 A.D."</li>
      <li><strong>1923</strong>-most of Lovecraft’s short stories appeared in the magazine Weird Tales.</li>
      <li><strong>1924</strong>-Lovecraft Marries Sonia Greene and moves to New York.</li>
      <li><strong>1925-1926</strong>-Begins the Draft of the "Call of Cthulhu"
      <li><strong>1927</strong>- The Case of Charles Dexter Ward was written (But was published posthumously in 1941).
      <li><strong>1928</strong>- His best novel known to this day "Call Of Cthulhu" was published.
      <li><strong>1936</strong>- "At the Mountains of Madness" and "The Shadow over Innsmouth" was published
      <li><strong>1937</strong>- H.P Lovecraft Dies.
  </ul>
  </section>
  <blockquote
              
           cite=https://www.britannica.com/biography/H-P-Lovecraft>
    <p id="fact">Lovecraft was interested in science from childhood, but lifelong poor health prevented him from attending college. He made his living as a ghostwriter and rewrite man and spent most of his life in seclusion and poverty. His fame as a writer increased after his death.</p>
    <h3> To learn more about H.P Lovecraft and his life on his
      <a
         id="tribute-link"
         
         href="https://en.wikipedia.org/wiki/H._P._Lovecraft"
         target="_blank"
         >wiki entry </a
        >.
    </h3>
    </main>

css:

html {
  font-size: 15px;
    color: green;
}
body {
  margin: 0 auto;
  background-color: black;
  text-align: center;

}

h1 {
 text-align: center;
  font-size: 50px;
  font-family: 'Nosifer', monospace;
  border-width: 30px;
  border-style: groove;
  border-radius: 100px;
  border-color: green;
  margin: 0;
}
img {
  max-width: 100%;
  display: block;
  height: auto;
  margin: 0 auto;
  border: solid;
  border-width: 5px;
  border-color: rgb(77, 72, 18);
}
#img-div{
  background-color: rgb(20, 38, 25);
  text-align: center;
  margin: 0 auto;
  border: dashed;
  border-width: 10px;
  border-color: rgb(47, 51, 20);
}
p{
  text-align: center;
  font-size: 25px;
}

#img-caption{
  text-align: center;
  font-size: 20px;
  font-family: fantasy;
}
h2{
  border: solid;
}
ul {
  max-width: 700px;
  margin: 0 auto 50px auto;
    text-align: left;
  font-size: 20px;
  border: dashed;
  line-height: 1.8;
}

#fact{
  text-align: center;
  max-width: 100%;
}

and again sorry if it looks like a big mess. if anyone wants to see what it looks like aswell here is my codepen link to the tribute page.

Did you get it?
I copied the code you sent, and in both the code and your codepen the image seems to indeed be centered.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.