The Problem:
I had a “mysterious” 3px gap below a couple of images and no matter what I did I couldn’t seem to get rid of it. It was as if the image was 3px taller or had 3px of margin or padding, but zeroing all of these attributes had no effect.
The Solution:
I finally hit upon the solution here.
In short, the article says that CSS2 compliant browsers align images to the baseline because they are replaced inline elements. The article goes on to show some appropriate solutions in different situations.
The solution that worked for me was:
img { vertical-align: bottom }
