Space gaps appear between vertical images if using strict.dtd

Hello Webmasterworld,

I'm seeing strange behaviors on some experimental codes below while using xhtml strict and transitional loose. All margins and paddings are set to zero for the test examples below. Tested both settings with 1pixel border and no border. Same effect.


<div><img src="asdf"></div>
<div><img src="fdsa"></div>...or ...
<img src="asdf"><br /><img src="fdsa">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
 "http://www.w3.org/TR/REC-html40/loose.dtd">

For the above declaration, the vertical images are stacked. No spaces appear in between, either with or without borders.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

This is the declaration that shows about a 5 pixel gap with the pseudo code. Even on non-xhtml, strict declaration there also appears the exact height gaps.

Why is this it, from the W3C standpoint? If the I replace the <img...> tags with text, then there are no gaps in between.

This quirk appears for both Mozilla and IE.

Thanks in advance for your view on this topic!

Space gaps appear between vertical images if using strict.dtd

but it won't appear if it's loose.dtd

urbanzen

Setek

swa66

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week