Tribute Page - Build a Tribute Page. My code isn't passing on the css side canyou please help me figure out what am doing wrong?

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

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"/>
    <link rel="stylesheet" href="styles.css"/>
    <title id="title">Grand Mama</title>
    </head>
    <main id="main">
      <body>
        <header>
<h1 id="tribute-info">Grand Ma's Life</h1>
<p>Lakucha</p>
</header>
        <div id="img-div">
          <img id="image">
        <figcaption id="img-caption">Grand Ma's Amazing Life</figcaption>
        </div>
        <a id="tribute-link" target="_blank" href="link.com">
        </body>
        </main>

/* file: styles.css */
div, img {display: block;}
div, img {display: flex; 
justify-content: center;
align-items: center;}
img .image {max-width: 100%;
height: auto;
display: flex; 
justify-content: center;
align-items: center;}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36 Edg/111.0.1661.62

Challenge: Tribute Page - Build a Tribute Page

Link to the challenge:

2

You have targeted img with many selectors, although only the last one will have an impact.
That last selector img .image doesn’t contain the required properties and values. Delete everything in css and try to add the following:

img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}
3

img {
display: block;
margin-left: auto;
margin-right: auto;
}
.image {
max-width: 100%;
margin-left: auto;
margin-right: auto;
}

4

the max-width property still isn’t passing I don’t know what am doing wrong

5

This is not a valid img element. Omitting the “src” attribute is not valid, but it will work. On the other hand, you have two times the same targeted element again. The height property also is missing.
Read again the post above:

6

even I have the same issue …

7

If you have completed that, then please tell the crct code

8

In Hi!

Please create your own topic when you have specific questions about your own challenge code. Only respond to another thread when you want to provide help to the original poster of the other thread or have follow up questions concerning other replies given to the original poster.

The easiest way to create a topic for help with your own solution is to click the Ask for Help button located on each challenge. This will automatically import your code in a readable format and pull in the challenge url while still allowing you to ask any question about the challenge or your code.

Thank you.

Also on the forum people don’t give out solutions to coding problems as long term this doesn’t help people learn. Instead it is better to guide people to work out the solution themselves.