font-size not inherited into table in backward-compatible "quirks" rendering mode




3 years ago
3 years ago


(Reporter: czerny.jakub, Unassigned)




Firefox Tracking Flags

(Not tracked)



(3 attachments)



3 years ago
Created attachment 8762570 [details]

Element (in demo <tabel> however it applies to any tried elements) is rendered with different `font-size` than expected. Devtools explorer correctly shows value from last applied style (12px) and actually used value (16px).

Steps to reproduce:
1. extract attached 50.0a1
2. open file 'Pinger - localhost.html' from the zip
3. inspect `font-size` css property of label address.

Actual result:
Topmost applied style sets it to 12px (from cockpit.css:1) however real size (rendered, returned by getComputedStyle() function, show in 'Computed' side-tab of inspector) is 16px.

Expected result:
Actual value of css property matches to value topmost applied style. In this case 12px.

Firefox version: 46.0.1, from packages, 
    also reproducible on 50.0a1 (2016-06-13)
OS: Fedora 22

Comment 1

3 years ago
* <label>

Comment 2

3 years ago
Created attachment 8762571 [details]

Comment 3

3 years ago
Created attachment 8762574 [details]

Oddly enough Chrome does the same thing and explains it by applying "user agent stylesheet".
Keywords: nightly-community
Version: 46 Branch → 50 Branch

Comment 4

3 years ago

Your attachment 8762570 [details] is a compressed file of some 20 files each with many KiloBytes. This is not best, not ideal.

Reduced test:

From quirks.css at line 51 of chrome/toolkit/res/quirks.css
table {
  text-align: start;
  white-space: normal; /* compatible with IE & spec */
  line-height: normal;

  /* Quirk: cut off all font inheritance in tables except for family. */
  font-size: initial;
  font-weight: initial;
  font-style: initial;
  font-variant: initial;

Chances are IE10+ and Edge also do the same thing. I am almost certain that this used to be a bug also in IE some 15 years ago: font-size not inherited into table in quirks mode.

Fixing Table Inheritance in Quirks Mode

The comment in the user agent style sheet at line 56 fits perfectly this bug report. This is an nth reason as to why no one should be triggering backward-compatible "quirks" rendering mode in any browser and should always use a valid, recommended doctype declaration triggering web-standards-compliant rendering mode.

Resolving as INVALID
Last Resolved: 3 years ago
OS: Unspecified → All
Hardware: Unspecified → All
Resolution: --- → INVALID
Summary: Element rendered with wrong CSS font-size → font-size not inherited into table in backward-compatible "quirks" rendering mode
Version: 50 Branch → Trunk

Comment 5

3 years ago
All of the style rules in layout/style/quirk.css apply only in quirks mode:
    Don't inhertit (sic) font properties into tables except for font-family.

Mozilla Quirks Mode Behavior

Jakub, use a valid doctype declaration at the beginning of your webpages (assuming of course that you are the web author of the files in attachment 8762570 [details] ... otherwise notify the web author about it).

More reading:

Don't forget to add a doctype

Comment 6

3 years ago
I just check that 'Pinger - localhost.html' from the zip and it has a doctype declaration... so I am confused now...

Re-setting bug to UNCONFIRMED


We need a reduced test from your zipfile. Your zipfile has 22 files and over 1 Mbyte of code. When I open, I can not find that label address you mentioned. I see that the page has iframes and so, my previous comments could still be relevant here.
Resolution: INVALID → ---

Comment 7

3 years ago
I got it! The label address is in the ping.html webpage (which was probably in one of the <iframe>s) and, indeed, it has no doctype declaration. So, 

resolving again as INVALID
Last Resolved: 3 years ago3 years ago
Resolution: --- → INVALID

Comment 8

3 years ago
Thank you Gérard for your prompt response and great explanation.
You need to log in before you can comment on or make changes to this bug.