Completely bizarre Firefox CSS bug_问答_开发者

开发者 https://www.devze.com 2022-12-26 20:21 出处：网络

I\'ve been doing front end developmen开发者_JAVA百科t for a long time, and I have NEVER come across a bug like this before...

I've been doing front end developmen开发者_JAVA百科t for a long time, and I have NEVER come across a bug like this before...

Save the following HTML to a file and view it in Firefox (mine is 3.6.3):

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <style type="text/css">
    body { font-family: Helvetica, Sans-Serif;}
    h2 {font-weight: normal;}
    </style>
</head>
<body>
     <h2>Some normal text <strong>some bold text</strong> weird huh?</h2>
</body>
</html>

If you don't want to give it a shot the output is like your cat walked across your keyboard while character map was turned on, except in the strong tags.

I feel like this may be a font issue? When I get rid of font-weight: normal it goes back to normal, but I don't want everything to be bolded in my h2... Anyone have any ideas? More importantly, is anyone able to reproduce this??

Thanks.

EDIT

Here's a screenshot. It works fine in all other browsers, and all text that has not previously been set as bold (normal text) renders fine.

This seems to be something Helvetica specific. Here is a number of reports with screenshots that look exactly like your case.

Mozilla Bug #444203 - Helvetica font rendering garbled/garbage on some web sites
Mozilla Forum - Firefox 3 displays garbage characters

They mention workarounds. On server side:

if the CSS definition defines the font family using font: instead of font-family:, this bug does not occur.

when setting the font-family by way of font-family: (instead of by font:), the error only occurs once you're showing fonts over 20pixels in size. It doesn't matter if the font size is set by way of em or px, but once the actual display size is over 20px, it gets garbled.

On the client side, it seems to be recommended to remove or re-install the Helvetica font. Can you check your fonts folder for any HELVETIC.TTF or similar files?

Have you checked your encoding?

When you remove Helvetica or Sans-Serif and replace them with other fonts, do you have the same problem? For example, have you tried using another fonts and then combinations of Helvetica and Sans-Serif with those:

Courier, Helvetica

Courier, Sans-Serif

This is may be due to a strange version of Helvetica loaded on your machine. Try disabling that font locally and see what happens.

Looks like this is something to do with the encoding (and not font). Check your encoding as it is decided by firefox: View -> Character Encoding. Is it UTF-8?
Does changing it to anything else (say Western (ISO8859-1)) change the characters?

Can you try disabling your addons, especially the theme and check (start firefox in safe mode)? Perhaps some add on is meddling with the encodings...