Space Under Image Link

Problem

I had the following code like so:

<div class=”someborder”><a href=”#”><img src=”someimage.png”></a></div><div>some text</div>

The class “someborder” basically made a border around the image.  The problem was that there would be some space under the image and then the border would show.  I took off all padding and margins on the image and divs and the space still would not go away.

Solution

Simple as vertical-align:text-bottom.  I’m guessing this works because I have some text in the next div.  Not sure why the text in another div would affect the image, but ok, it works.

img {
vertical-align: text-bottom;
}

source: http://csscreator.com/node/110