|
Posted by Ben C on 03/06/07 23:26
On 2007-03-06, Rik <luiheidsgoeroe@hotmail.com> wrote:
> X l e c t r i c <Xlectric@webtv.net> wrote:
>
>> I did this page, to post at a webtv news group, to show what happens
>> when we do and do not specify values for table attributes.
>>
>> http://www.xlectric.com/info/html/tabatt.html
>>
>> When I viewed it on my PC I noticed that with some of the browsers there
>> is still some space at the bottom of the tables even when specifying
>> values of 0 (zero) for cellpadding and cellspacing.
>>
>> I explain myself at the bottom of the page. Is there something that can
>> be done to eliminate that space, or is that simply the way it is ?
>
> Hmmz, I'm not the one to explain in depth the reasons why, as I'm really
> not qualified to do so, but this works in Opera:
> td img{vertical-align:bottom;}
>
> Floating the images would also work. It has something to do with how
> inline images are placed on a line. Anyone with more to the point
> knowledge care to elaborate?
Sounds like that's the one.
An <img> is inline and has vertical-align: baseline by default, so it
sits on the baseline, which means a gap underneath it for descenders in
the current font (tails of letters like g, y).
Firefox does a quirks-mode switch on this one. If you don't give it the
strict doctype, computed line height for a line containing only images
is the height of the highest image, which is aligned to the bottom of
the line box.
img {display: block;} is sometimes another solution.
Navigation:
[Reply to this message]
|