font size as a percentage of the parent should get smaller shouldn't it?

[David Graham]

I am working my way through Eric Meyer's book on CSS. I have finished the
first chapter on converting a table based design to CSS. I have uploaded the
page

http://p0c79.phpwebhosting.com/~p0c79/ch01projopy.html

I would like to know why Eric has got the text in the middle of the footer
to be a bit bigger than the rest of the text in the footer by doing the
following

tr#footer td {vertical-align: middle; font-size: 66%; border-top: 3px solid
#EFE1D1;}
tr#footer td#tg {font-size: 85%; text-align: center;}

From what I've learnt in this group, such a declaration would make the
center text 85% of 66% which should be even smaller than 66% yet the text in
the middle of the footer is bigger not smaller. What am I missing?

(I realise that font percentages less than 80% are bad for accessibility -
don't know why Eric has gone as low as 66%)

TIA
David

 

[Steve Pugh]

tr#footer td {vertical-align: middle; font-size: 66%; border-top: 3px solid
#EFE1D1;}
tr#footer td#tg {font-size: 85%; text-align: center;}

From what I've learnt in this group, such a declaration would make the
center text 85% of 66% which should be even smaller than 66% yet the text in
the middle of the footer is bigger not smaller. What am I missing?

No, the second style does not inherit font-size from the first.
They both inherit the font-size from the parent element and then apply
the percentage specified to that.

properties are inherited from elements further up thedocument tree.

<td id="tg"> inherits font-size from the tr (and the table, and so on
upwards) and then applies one or the other of the two styles above. As
the second one is more specific it appies that one.

If the first style was tr#footer {} then yes the second style would
lead to the font-size being 85% of 66%.

Steve

 

[David Graham]

No, the second style does not inherit font-size from the first.
They both inherit the font-size from the parent element and then apply
the percentage specified to that.

properties are inherited from elements further up thedocument tree.

Of course - stupid me. For some reason I was thinking that tr#footer td was
the parent of tr#footer td#tg - but it is a sibling. I don't know why I
didn't spot that.
Thanks Steve for putting me right on this one.

David