626319 - Font-weight of "Lighter" makes text hard to read on OSX with Minefield

Status: RESOLVED INVALID

(Core :: CSS Parsing and Computation, defect)

Description

[Yansky]

User-Agent:       Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b10pre) Gecko/20110116 Firefox/4.0b10pre
Build Identifier: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b10pre) Gecko/20110116 Firefox/4.0b10pre

When an element has been given a style rule of font-weight:lighter;, the text inside the element is rendered in such a way to make it very difficult to read. 



Reproducible: Always

Steps to Reproduce:
1. Go to http://www.binarynights.com/store
Actual Results:  
Text is very difficult to read.

Expected Results:  
Text should just be lighter than the parent element.

I've had other people check on Windows with Minefield and the text seems to render fine for them, so it seems like it's OSX specific.

Comment 1

[philippe (part-time)]

That is to be expected. In bug 93725, D. Baron implemented the new logic for font-weight 'lighter' and 'bolder. That site uses 'helvetica neue', which is one of the very few fonts that actually ship with a real 'font-weight: 100' face (on OS X 10.4 - 10.6).

see http://www.w3.org/Style/css2-updates/css2/fonts.html#propdef-font-weight
scroll down for the 'The meaning of 'bolder' and 'lighter' headline

see also the css 3 fonts module, which has nearly equivalent wording http://www.w3.org/TR/css3-fonts/#font-weight-the-font-weight-property

That site should be contacted, the probably should use font-weight: 300 instead of 'lighter' to get the effect they intended.

Comment 2

[Anthony Ricaud (:rik)]

Found this issue on http://pushpoppress.com/about/ also.

Should this be turned into an evangelism bug now?

Comment 3

[Florens Verschelde :fvsch]

Attachment: Test case for font-family Helvetica Neue + font-weight lighter

Comment 4

[Florens Verschelde :fvsch]

Added a simple test case reproducing the issue seen on URL in comment 2.
The version of Helvetica Neue shipped on OS X has several weights, including Regular, Light and Ultra Light. They map to the font-weight values 400, 200/300, and 100, respectively.

When using font-weight:lighter on an element whose parent has a computed value of 400, the expected result for Helvetica Neue is to get Helvetica Neue Light (one step down, from 400 to 200).
The result we're seeing is two steps down, from 400 to 100 (Helvetica Neue Ultra Light).

Finally, for the table at the end of http://www.w3.org/TR/css3-fonts/#font-weight-prop which seems to hint that one step down from font-weight:400 is font-weight:100, we should note that this table is only an example that is valid for "a font family containing normal and bold faces along with a thin and a heavy face". This table will be different for every font-family and browsers should not implement this example as a rule (not that I'm implying Firefox is doing this ;)).

Comment 5

[David Baron :dbaron: (⌚️UTC-5, no longer working on Mozilla)]

(In reply to comment #4)
> Finally, for the table at the end of
> http://www.w3.org/TR/css3-fonts/#font-weight-prop which seems to hint that
> one step down from font-weight:400 is font-weight:100, we should note that
> this table is only an example that is valid for "a font family containing
> normal and bold faces along with a thin and a heavy face". This table will
> be different for every font-family and browsers should not implement this
> example as a rule (not that I'm implying Firefox is doing this ;)).

No, the table is the specification; what's an example is that it's equivalent to one step in the font if the font has 100/400/700/900 weights.

I agree the spec could probably be a little clearer here.


If you know you want 200 weight, you should specify that.

Comment 6

[Florens Verschelde :fvsch]

> No, the table is the specification.

Yes, looks like I had misread the paragraph above the table.