Mysterious padding/margin appears after image in strict mode

Viewed 7317

I created a new document both with xhtml 1.0 and html 4.01 STRICT just to isolate this. All I have in its body is:

<div style="border: blue 3px solid;">
<img src="testimage.jpg" width="800" height="400">
</div>

The result is normal except there's a 5px space below the image that goes away if I change the doctype to transitional. It also goes away if I set display: block to the image.

You can see the result yourself here (I know the white space on the right is normal since its a block element): http://i52.tinypic.com/2prd1jd.jpg

I tried setting margin/padding to 0, even this:

*
{
   margin: 0; padding: 0;
}

but it's still the same.

Can anyone please explain this behavior?

2 Answers
Related