On 2008-03-31, John Dann <news@prodata.co.uk> wrote:
> On Sun, 30 Mar 2008 15:12:55 -0400, Gus Richter
><gusrichter@netscape.net> wrote:
>
>>Or make the img vertical-align:bottom;
>
> Just as a follow-up point here:
>
> This solution works OK but I'm slightly surprised that an equivalent
> space doesn't then appear at the top of the box (ie what one might
> think of as an ascender space). It's as if by using
> vertical-align:bottom then the bounding box is actually made shorter
> (ie less tall) and not simply that the img is bottom-aligned rather
> than top-aligned.

That's exactly what happens.

> Is this just how the browser engines are designed to work, ie the
> process is not symmetrical top-to-bottom?

It is all in the CSS 2.1 specification but it's a bit of a nightmare.

That's why I suggested display: block. It also expresses more clearly
what you want since in your example there is no text nearby, you just
want the imgs to display like blocks.