[thelist] Little <img> tag problem

[Scott Schrantz]

> -----Original Message-----
> From: Rodrigo Galindez [mailto:rodrigo at cedha.org.ar]
>
> http://www.cedha.org.ar/desarrollo/index_new.html
> 
> when I try it on Mozilla Firebird, it seems to put a "blank"
> space between the images.

I think what's causing this is a common issue with Mozilla. It doesn't do things "wrong", just different. The gap you're seeing is space that's reserved for the descenders in text. You know, the parts of the g and the j and the p that drop below the baseline. IE places images on the absolute bottom, so that descender space is hidden behind the image. Mozilla places images on the baseline, so the descender space is visible as a few-pixel gap underneath the image. You can fix it by setting vertical-align: text-bottom on the <img> tag, or by setting font-size: 0 on the <p> tag your images are in. Your images /are/ in a <p> tag, right? It's technically valid to put inline content directly in a <div>, but for me it's always a best practice to wrap everything in a <p>.

p {
font-size: 0;
}

<div>
<p>
<img /><br />
<img />
</p>
</div>

--
Scott Schrantz
work: www.rci-nv.com
play: www.computer-vet.com/weblog/