Unwanted line in IE7

Could anyone tell me why have and unwanted line bisecting the Fuschias graphic and the adjacent images on this page: www.susansargent.com/sarghome2.html. It only seems to occur in IE7. I use IETester and it is sometimes inaccurate so if it looks OK to you let me know.



Images are inline elements by default and they are treated like text. IE6/7 will set their vertical-align as baseline unless you override it. They do that to make room for text descenders such as the stem of a ā€œpā€ or a "yā€™ etc.

You can fix IE by adding this to your stylesheet

img {vertical-align:bottom}

Or by targeting that specific image with a class.

img[COLOR=Blue].va-bot[/COLOR] {vertical-align:bottom}

<img [COLOR=Blue]class="va-bot"[/COLOR] src="foo.jpg">