Help in Tribute Page

HTML-CSS
1

Hi. i’m having trouble to complete this exercise. For some reason, i just cant complete these tests:

** 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.**

Yes, i search a lot to resolve this but i just cant. heres my code:

HTML

<body>
    <main id="main">
        <div id="img-div">
            <img id="image" src="assets/83380d267d690148262009148d95eab7.jpg" alt="a bounch of fishes!" />

            <figcaption id="img-caption">フィッシュマンズ</figcaption>
        </div>

CSS

body {
    padding: 0;
    margin: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: rgb(106, 133, 124);
}

#img-div {
    text-align: center;
    margin-top: 5em;
}

#image {
    max-width: 100%;
    height: 10em;

    border-radius: 1em;
    box-shadow: 1px 5px 5px rgba(0, 0, 0, 0.575);
    cursor: pointer;
    transition: width 1s;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
2

Have you posted all your code? I don’t see how you linked the css file to the html file

1 Like
3

hi! i figured out! :frowning: idk how to delet my post

1 Like
4

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