結論としては、画像に謎の余白が開く場合は、CSSで vertical-alignを指定することで、解決できた。
詳しいことは、調べてないけど、JPEG画像で余白は確認されず、透過PNGを使用したときだけ、不要な余白が下の方に確認された。画像の種類で色々とあるのかもしれないし、ブラウザーによっても挙動が違うのかも。
画像の下のコンテンツに合わせたかったので、vertical-align:bottom; をCSSで指定することで、解決した。きっと上の余白の場合は、vertical-align:top;とかで良さそう。