Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

Ce site disposera de fonctionnalités limitées pendant que nous effectuons des opérations de maintenance en vue de vous proposer un meilleur service. Si un article ne règle pas votre problème et que vous souhaitez poser une question, notre communauté d’assistance est prête à vous répondre via @FirefoxSupport sur Twitter, et /r/firefox sur Reddit.

Avatar for Username

Rechercher dans l’assistance

Évitez les escroqueries à l’assistance. Nous ne vous demanderons jamais d’appeler ou d’envoyer un SMS à un numéro de téléphone ou de partager des informations personnelles. Veuillez signaler toute activité suspecte en utilisant l’option « Signaler un abus ».

En savoir plus

Ce sujet de discussion a été archivé. Veuillez poser une nouvelle question si vous avez besoin d’aide.

firefox 9 doesn't handle the css font stack properly

  • 5 réponses
  • 28 ont ce problème
  • 18 vues
  • Dernière réponse par krakrjak

dan34
dan34
more options

The style body{font:13px/1.231 arial,helvetica,sans-serif;*font-size:small;*font:x-small} should cause the browser to work through the stack and use sans-serif if arial and helvetica are not available. This is how it worked in Firefox 8 and how it works in other browsers.

With Firefox 9 if the first font is unavailable it just substitues one of it's own instead.

If I remove arial and helvetica from the list then FF9 uses the system sans-serif as it should.

I would paste in some sample code, but this forum doesn't seem to support code snippets.

The style body{font:13px/1.231 arial,helvetica,sans-serif;*font-size:small;*font:x-small} should cause the browser to work through the stack and use sans-serif if arial and helvetica are not available. This is how it worked in Firefox 8 and how it works in other browsers. With Firefox 9 if the first font is unavailable it just substitues one of it's own instead. If I remove arial and helvetica from the list then FF9 uses the system sans-serif as it should. I would paste in some sample code, but this forum doesn't seem to support code snippets.

Toutes les réponses (5)

krakrjak
krakrjak
more options

This is a HUGE deal. You've broken many sites internally that my company uses and that I maintain. This is a problem that affects all pages and breaks how CSS behaves. Here's a link to a site with a specific code example that shows off this bug: http://krakrjak.blogspot.com/2012/01/firefox-901-font-css-bug.html

Please fix this so I can quit answering questions about why our sites are broken in what appears to be the most popular browser at the company.

Thank you!

krakrjak
krakrjak
more options

No one from Mozilla has responded to this even though it continues to be a PITA. A bug has been opened on this issue at https://bugzilla.mozilla.org/show_bug.cgi?id=718016

If you are interested in getting this bug fixed please go to bugzilla.mozilla.org and vote for bug 718016.

knorretje
knorretje
more options

The css in the blogpost http://krakrjak.blogspot.com/2012/01/firefox-901-font-css-bug.html is wrong, and that is why this does not work in Firefox. To access a class you must use the class selector (a dot). For example: .p-inner p { }
You can go to Mozilla Developer Network to learn CSS.
https://developer.mozilla.org/en-US/learn/css

krakrjak
krakrjak
more options

I see what you mean. So using the # notation (id selector) instead of using the correct . notation (class selector) lead to this issue for me. It just appears that FireFox got a little more strict around the standard and that means the code I am maintaining is full of non-standard CSS that I will have to fix up now... ooh well.

Interestingly enough this worked up until 9.0. I do see that this is not valid CSS now. Thanks for the link.

There still seems to be an issue that Dan is tracking down that is separate from my misuse of CSS.

krakrjak
krakrjak
more options

I have updated the blog post to show what the issue with my CSS is and how to avoid the issue and write correct CSS in this respect.

http://krakrjak.blogspot.com/2012/01/firefox-901-font-css-bug.html

Modifié le par krakrjak