Is there a container holding the images? How was there extra space beneath the image to create a background color?

Hi Mariam,

As Jonathan has pointed out, the "li" element is wrapping more than one child element as you can see from the small code snippet below from that course.

                <li>
                    <a href="img/numbers-06.jpg">
                        <img src="img/numbers-06.jpg" alt="This is an image of blending modes used in Photoshop">
                        <p>Playing with blending modes in Photoshop</p>    
                    </a>
                </li>

So your situation here is that if you have the "li" set with a background color, this will in turn be the background color for any child elements because by default an element has no, or shall we say a transparent background unless or until you provide those child elements with a background color independently.

So... using the code above here is some CSS that might help a little more to explain.

// Using this on its own will make the background of the li, a, img, and p all the specified color.
li {
  background: #f5f5f5;
}

// If you then give the p tag a background this will independently change the p tags background and if there is any space above of below the p tag for example from some margins, then you would see the background color of the li come through.
li {
  background: #f5f5f5;
}

li a p {
  background: #ff00ff;
}

I have thrown this together so you can have a play around with the code quickly to see what happens and maybe help gain a better understanding. Link

Hope this helps Craig