Problem with img and #image

HTML-CSS
1

Tell us what’s happening:

I’m trying to complete the challenge. I made my own page, with some more things that the lesson is asking for. But i can’t get the img element and the #image to work.
Based on the question this should be OK, but i’m getting these errors:
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.

Your code so far

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="style.css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <main id="main">
        <title id="title">Raymond Reddington</title>
        <h1>Dedicated to the life of Red</h1>
        <figure id="img-div"><img id="image" src="/img/Blacklist-James-Spader-Coat-1000x1100.jpg" alt="Raymond"><figcaption id="img-caption">Raymond</figcaption></figure>
        <section>
        <div id="tribute-info">

img{
      display:block;
      justify-content: center;
      margin: 0px auto;
      text-align: center;
}

#image{
    max-width:100%;
    height: auto;
    
}

Your browser information:

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

Challenge Information:

Tribute Page - Build a Tribute Page

2

I don’t see anything to link the css to the html file. You need to add that code!

3

Yeah i had it linked but it was linked like style.css not styles.css. That was the error. Thank you