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

RESOLVED INVALID

Status

()

Core
CSS Parsing and Computation
RESOLVED INVALID
2 years ago
2 years ago

People

(Reporter: Jakub Czerny, Unassigned)

Tracking

({nightly-community})

Trunk
nightly-community
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(3 attachments)

(Reporter)

Description

2 years ago
Created attachment 8762570 [details]
font-size-demo.zip

Description:
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 font-size-demo.zip
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
(Reporter)

Comment 1

2 years ago
* <label>
(Reporter)

Comment 2

2 years ago
Created attachment 8762571 [details]
font-size-inspector.png
(Reporter)

Comment 3

2 years ago
Created attachment 8762574 [details]
font-size-chrome.png

Oddly enough Chrome does the same thing and explains it by applying "user agent stylesheet".

Updated

2 years ago
Keywords: nightly-community
Version: 46 Branch → 50 Branch

Comment 4

2 years ago
Jakub,

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

Reduced test:

http://www.gtalbot.org/BugzillaSection/Bug1279948-font-size-not-inherited-in-table-quirks-mode.html

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
https://developer.mozilla.org/en-US/docs/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
Status: UNCONFIRMED → RESOLVED
Last Resolved: 2 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

2 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
https://developer.mozilla.org/en-US/docs/Mozilla/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
https://www.w3.org/QA/Tips/Doctype

Comment 6

2 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

Jakub,

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.
Status: RESOLVED → UNCONFIRMED
Resolution: INVALID → ---

Comment 7

2 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
Status: UNCONFIRMED → RESOLVED
Last Resolved: 2 years ago2 years ago
Resolution: --- → INVALID
(Reporter)

Comment 8

2 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.