Your img element should have a display of block 2

Tell us what’s happening:

I have an img selector and inside I have the display set to block, but it doesn’t pass the test saying that my img should have a display of block. I tried using the #main class to select the #image element but it didn’t work either.

  **Your code so far**
/* file: index.html */
<main id="main">
<title id="title">GM Alexandra Kosteniuk </title> 
<figure id="img-div">
  <img id="image" src=""></img> 
  <figcaption id="img-caption">chessqueen</figcaption>

<text id="tribute-info">April 23, 1984: birthday</text>

<a href="" target="_blank" id="tribute-link"></a>
/* file: styles.css */
img {
display: block;

#main #image {
max-width: 100%; 
max-height: 80%; 
margin-left: auto;
margin-right: auto;
height: auto; 

#main #img-div {


#main #img-caption {


#main #tribute-info {


#main #tribute-link {

  **Your browser information:**

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

Challenge: Build a Tribute Page

Link to the challenge:

Create a class inside the figure and give the name of that class after using that class name you can run your program

I added the class=“gm” and used the
.gm {
display: block;
rule but the test still fails.

Still having the issue, no image selectors are working, and all of the five previous posts on this topic do not have working solutions.

I am not using display: flex anywhere

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