Prev: Show List on Image Hover
Next: images and text
From: John Dann on 30 Mar 2008 16:40
Many thanks for the answers.

On Sun, 30 Mar 2008 15:12:55 -0400, Gus Richter
<gusrichter(a)netscape.net> wrote:

>
>Or make the img vertical-align:bottom;

Seems to work for FF2 but not for IE7 AFAICS.

JGD
From: John Dann on 30 Mar 2008 16:47
On Sun, 30 Mar 2008 21:40:21 +0100, John Dann <news(a)prodata.co.uk>
wrote:

>Seems to work for FF2 but not for IE7 AFAICS.
>
Whoops - too quick off the mark! It worked immediately on a page
refresh in FF2, but not immediately in IE7. But when I closed IE7
fully and reopened it then it did work. Is the cache for the CSS file
more persistent in IE7 than the cache for the html file?
From: dorayme on 30 Mar 2008 19:53
In article <0ggvu31c6pp0pe355anqqo97a5l4t2t1ot(a)4ax.com>,
John Dann <news(a)prodata.co.uk> wrote:

> The question is why there seems to be a bottom margin of white space
> to the clouds image (in IE7 and FF2.0.12 at least) when AFAICS all
> the relevant margins, padding etc are set to zero in the stylesheet.
>
> I'd like to try to understand what's generating this specific problem
> if anyone can offer an explanation please.


<http://tinyurl.com/2x3t8f>

--
dorayme
From: John Dann on 31 Mar 2008 05:20
On Sun, 30 Mar 2008 15:12:55 -0400, Gus Richter
<gusrichter(a)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. Is this just how the browser engines are designed to
work, ie the process is not symmetrical top-to-bottom?
From: Ben C on 31 Mar 2008 06:18
On 2008-03-31, John Dann <news(a)prodata.co.uk> wrote:
> On Sun, 30 Mar 2008 15:12:55 -0400, Gus Richter
><gusrichter(a)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.
 |  Next  |  Last
Pages: 1 2
Prev: Show List on Image Hover
Next: images and text