Unlike other browsers, FF doesn't recognise Arial Black, Arial Narrow + some other font-family names (Win7)
I have a problem - or maybe you do - I hadn't noticed this before... but consider this simple bit of HTML:
<p style="font-family:arial black,courier;">Font Test - Tony</p> - (yes, I know, but it's just a test...)
This renders correctly (ie: shows Arial Black) in Chrome, IE (7-11), Safari (not yet tried Opera).
Putting quotes around 'arial black' or capitalising makes no difference. Arial narrow is the same as are some other (less common) fonts - eg: Franklin Gothic Medium, and there may well be others. The result is the same - all other browsers render these fonts fine - FF defaults to standard.
Now, I can't say if this has always been true - I mostly stick with Verdana, Tahoma, Arial (and Comic Sans MS has never been a problem), so I don't know if this is to do with the latest release only.
Whatever, given that these are very common fonts on Windows/Mac it's a bit distressing that they don't work - how times change?? - it used to be IE that gave us web developers all the problems...
I await your response
Thanks
Tony
Modified
All Replies (4)
On Windows Vista and later, when using DirectWrite rendering, Firefox treats Arial Black and Arial Narrow as subsets of the Arial family, rather than separate font families.
- https://developer.mozilla.org/docs/Web/CSS/font-weight
- https://developer.mozilla.org/docs/Web/CSS/font-stretch
/* Arial Black */ * { font-family: "Arial Black", Arial; font-weight: 800; } /* Arial Narrow */ * { font-family: "Arial Narrow", Arial; font-stretch: condensed; }
aGnotherGnu wrote:
consider this simple bit of HTML:
Font Test - Tony
There's no HTML there. If you need to include code here, wrap it in <nowiki> tags. If you need to share a test case, you can put it on a site like http://jsfiddle.net and share the link.
aGnotherGnu wrote:
not yet tried Opera
Not really worth the bother. You're practically guaranteed to get the same results as Chrome. The only notable difference I can think of is that Opera doesn't support MP4/H.264 video files.
Modified
Sorry - didn't understand the rules - the missing HTML is:
<P style="font-family:arial black,courier;">Font Test - Tony </P>
Next time, try and do better and allow normal text...
Modified
aGnotherGnu wrote:
Sorry - didn't understand the rules - the missing HTML is:
<P style="font-family:arial black,courier;">Font Test - Tony </P>
<p style="font-family: 'Arial Black', Arial, Courier; font-weight: 800;">Font Test - Tony </p>
Feel free to vote for the report to keep track of any progress, but please don't post comments unless you have technical information to add. See the Bugzilla etiquette page for details.
- Bug 644385 - Arial Narrow, Arial Black fonts do not show on page
Modified
All very well, but I shouldn't need to be doing this - whatever happened to the increasing cross-browser compatibility which even IE has espoused since v9?
As I said, it is now FF which the joker in the pack giving all the problems.
But thanks for the explanation, Gingerbread Man...