views:

755

answers:

1

I have a webpage where Firefox 2 displays the font certain, really specific elements, larger than than what I specified in the CSS.

When I look at the affected element (mostly td elements as far as I can tell) with Firebug, I see that the font size is inherited from the body (11px, so its not a relative size). No styles overwrite this font size, anywhere. When I toggle the Show computed style option, the font size is displayed as 16px, Firefox's default.

It seems that the td does not inherit the font size properly. Obviously, I could specify a more specific CSS selector targeting the td (which in fact works) but I can't find any documented behavior of Firefox not inheriting the font size properly. It only happens in just a few tables, but completely unrelated to each other.

Does anyone know if I am overlooking something or is this a rendering issue in Firefox? Internet Explorer (I know, not the best reference for standards compliance) does not scale the font sizes up in tables.

+7  A: 

This is a reasonably well known annoyance: TABLEs and TDs will inherit all font styles except font-size, at least in XHTML. To "fix" this, set the font size also for the TABLE or TD element.

So to clarify, this is not Firefox-specific. Did you test in other browsers?