Question

Okay, so I’m designing this site. Here’s the HTML markup of this simple element:

http://thegrantmag.com

It’s the image box at the bottom of the screen, below the content area. It has a strip of white space below it. I’m usually pretty good at CSS troubleshooting, but this one has me. I’ve tried removing all the elements with the element inspector. As long as that image exists, there is a thin strip of white space below.

UPDATE: I tried removing the img and replacing with a div. It always creates a few extra pixels below the element, no matter what gets put in there!

Answer 1

it’s better if you define vertical-align:top in your image.

img{
 vertical-align:top;
}