631193 - The font "MS Sans Serif" is ignored

Status: RESOLVED FIXED

(Core :: Layout: Text and Fonts, defect)

Description

[Markus Fischer]

User-Agent:       Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0b10) Gecko/20100101 Firefox/4.0b10
Build Identifier: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0b10) Gecko/20100101 Firefox/4.0b10

On the given page are multiple paragraph using class="Stil1", whereas Stil1 is defined as:

.Stil1 {
    font-family: "MS Sans Serif";
    font-size: 14px;
}

The font is ignored, with a clean profile FF4b10 falls back to the browser default font.

The same font/css in latest FF3 on the same machine, Windows 7 Professional 64bit.

This is just an example page from this site, all pages on this site using "MS Sans Serif" do not render properly.

Reproducible: Always

Steps to Reproduce:
1. open http://www.netdoktor.at/health_center/impfen/hpv.shtml
2. look at the font of any paragraph of the text on that page

Actual Results:  
Font is rendered as the browsers default font (e.g. Times New Roman)

Expected Results:  
Font should be rendered with "MS Sans Serif"

Comment 1

[Markus Fischer]

Attachment: Screenshot of Firefox 3 rendering MS Sans Serif correctly

Comment 2

[Markus Fischer]

Attachment: Screenshot of Firefox 4b10 ignoring MS Sans Serif

Comment 3

[Jonathan Kew [:jfkthame]]

When Direct2D and therefore also DirectWrite is enabled, bitmap fonts such as MS Sans Serif (and others) are ignored because DW does not support the old .fon font format. See "Supported font formats" at http://blogs.msdn.com/b/text/archive/2009/04/13/directwrite-questions-and-answers.aspx.

Perhaps we should consider adding substitutions for some common bitmap-only fonts that ship with Windows; e.g. MS Sans Serif -> Arial, MS Serif -> Times, etc.

Comment 4

[Markus Fischer]

(In reply to comment #3)
> When Direct2D and therefore also DirectWrite is enabled, bitmap fonts such as
> MS Sans Serif (and others) are ignored because DW does not support the old .fon
> font format. See "Supported font formats" at
> http://blogs.msdn.com/b/text/archive/2009/04/13/directwrite-questions-and-answers.aspx.

Thanks! Sorry I wasn't aware of the DW connection, else I wouldn't have opened this unnecessary bug ...

> Perhaps we should consider adding substitutions for some common bitmap-only
> fonts that ship with Windows; e.g. MS Sans Serif -> Arial, MS Serif -> Times,
> etc.

I guess it would be good to know how others browsers plan to substitute so the results aren't too different ... thanks.

Comment 5

[Jonathan Kew [:jfkthame]]

(In reply to comment #4)

> I guess it would be good to know how others browsers plan to substitute so the
> results aren't too different ... thanks.

The main problem here, really, is poorly-implemented web design. The page should not be calling for "MS Sans Serif" alone; what do they expect to happen for Mac or Linux or Android users, for example, who surely won't have "MS Sans Serif" installed? At the very least, they should be using a CSS font stack that includes the generic "sans-serif" after any specific faces they want to request.

Still, if you want to morph this bug into something like "provide DirectWrite substitutes for standard Windows bitmap-only fonts", I think we should consider it.

Comment 6

[Markus Fischer]

(In reply to comment #5)
> The main problem here, really, is poorly-implemented web design. The page
> should not be calling for "MS Sans Serif" alone; what do they expect to happen
> for Mac or Linux or Android users, for example, who surely won't have "MS Sans
> Serif" installed? At the very least, they should be using a CSS font stack that
> includes the generic "sans-serif" after any specific faces they want to
> request.

I'm not going into the poorly-implemented design argument, I'm all on your side.

However there's another observation I made I cannot explain:
1. open http://www.netdoktor.at/health_center/impfen/hpv.shtml
2. use Firebug to select the first paragraph starting with "Humane Papilloma..."
3. use Firebug to deactivate the "font-family" attribute on "Stil1"
4. FF4 shows the fallback font specified in the "SPAN, TD" selector (which is "1em verdana,tahoma,arial,helvetica")

What I don't understand: FF4 can't render "MS Sans Serif" but doesn't automatically fallback to the other selector. I've to explicitly disable the "MS Sans Serif" font. Isn't that a bug?

Comment 7

[Jonathan Kew [:jfkthame]]

(In reply to comment #6)
> (In reply to comment #5)
> > The main problem here, really, is poorly-implemented web design. The page
> > should not be calling for "MS Sans Serif" alone; what do they expect to happen
> > for Mac or Linux or Android users, for example, who surely won't have "MS Sans
> > Serif" installed? At the very least, they should be using a CSS font stack that
> > includes the generic "sans-serif" after any specific faces they want to
> > request.
> 
> I'm not going into the poorly-implemented design argument, I'm all on your
> side.
> 
> However there's another observation I made I cannot explain:
> 1. open http://www.netdoktor.at/health_center/impfen/hpv.shtml
> 2. use Firebug to select the first paragraph starting with "Humane
> Papilloma..."
> 3. use Firebug to deactivate the "font-family" attribute on "Stil1"
> 4. FF4 shows the fallback font specified in the "SPAN, TD" selector (which is
> "1em verdana,tahoma,arial,helvetica")
> 
> What I don't understand: FF4 can't render "MS Sans Serif" but doesn't
> automatically fallback to the other selector. I've to explicitly disable the
> "MS Sans Serif" font. Isn't that a bug?

I don't think so. I'm no CSS expert, but as I understand it, the font-family property on the <p> overrides the font-family inherited from its ancestor <td> element; there's no "fallback to my ancestor's font if this one doesn't match". Fallback occurs along the list of font-family names that are found in the computed value of the font-family property for the element, which is *either* specified on the element itself *or* inherited from its ancestor, but not both.

Comment 8

[Markus Fischer]

(In reply to comment #7)
> I don't think so. I'm no CSS expert, but as I understand it, the font-family
> property on the <p> overrides the font-family inherited from its ancestor <td>
> element; there's no "fallback to my ancestor's font if this one doesn't match".

I think you're absolutely right, my confusion doesn't want to end today. Sorry again for spamming.

(In reply to comment #5)
> Still, if you want to morph this bug into something like "provide DirectWrite
substitutes for standard Windows bitmap-only fonts", I think we should consider
it.

Not sure if I'm to decide, but sure that would help me and others having the issue.

Comment 9

[Markus Fischer]

Attachment: MS Sans Serif in IE8 on Windows 7

Comment 10

[Markus Fischer]

Attachment: MS Sans Serif in IE9 on Windows 7

Comment 11

[Markus Fischer]

I've attached two more screenshots comparing IE8 with IE9 in regards how they render MS Sans Serif. Seems IE9 figured out a way to substitute the old font with a nicer one.

Comment 12

[Markus Fischer]

I figure out that there exists another font called "Microsoft Sans Serif" and, as described by http://en.wikipedia.org/wiki/MS_Sans_Serif as "... a TrueType font that is designed as a vectorized, metric-compatible variant of MS Sans Serif, first distributed with Windows 2000 and later."

I think that is what IE9 and possible others are doing here. Silently substituting "MS Sans Serif" with "Microsoft Sans Serif". This font is also available on Mac OS since v10.5 (according to the Wikipedia article).

Maybe that's an option for the DEVs?

Comment 13

[j.j.]

Fixed with bug 642093 for Fx5