Firefox displaying a different font on personal website than the one that is intended.
The opening para of the home page of my website is written in "Georgia Italics' font. In every browser except Firefox the text is displayed in that font. Browsed in Firefox is appears in an extreme version of a similar font but awful to look at. This happens on both my Mac and Windows 8. How can I get Firefox to display the font that was intended?
Chosen solution
Peter Plant said
On home page intro Georgia italic appears bent in the extreme. Okay on other pages though.
I didn't seen Georgia on other pages, but I only checked three.
It seems your designer used the Georgia Italic file (georgiai.ttf) and renamed it to georgia.ttf. Firefox is slanting that font to simulate italics, which is really unhelpful when it is already an italic font. Probably Firefox should detect that it doesn't need to do that, but that's the kind of thing that would take months to change. And I'm sure you would like a fix today.
For now, I suggest asking your designer to add a new @font-face rule to the
http://peterplant.com/webfonts/georgia/stylesheet.css
file so Firefox knows georgia.ttf is already an italic font and doesn't need further slanting. I also suggest leveraging the built-in font if the user has it. So that would be:
/* To handle h4 italic Georgia */
@font-face {
font-family: 'georgia';
font-style: italic;
src: local('Georgia Italic'), url('georgia.ttf') format('truetype');
}
Read this answer in context
👍 1
All Replies (4)
Do you have installed the font on your devices? Or are you using an URL link from a font webpage?
Web designer uses DreamWeaver with CSS (Cascading Style Sheet) to source fonts. Georgia Italic reproduced properly on all other pages of peterplant.com. On home page intro Georgia italic appears bent in the extreme. Okay on other pages though.
Chosen Solution
Peter Plant said
On home page intro Georgia italic appears bent in the extreme. Okay on other pages though.
I didn't seen Georgia on other pages, but I only checked three.
It seems your designer used the Georgia Italic file (georgiai.ttf) and renamed it to georgia.ttf. Firefox is slanting that font to simulate italics, which is really unhelpful when it is already an italic font. Probably Firefox should detect that it doesn't need to do that, but that's the kind of thing that would take months to change. And I'm sure you would like a fix today.
For now, I suggest asking your designer to add a new @font-face rule to the
http://peterplant.com/webfonts/georgia/stylesheet.css
file so Firefox knows georgia.ttf is already an italic font and doesn't need further slanting. I also suggest leveraging the built-in font if the user has it. So that would be:
/* To handle h4 italic Georgia */
@font-face {
font-family: 'georgia';
font-style: italic;
src: local('Georgia Italic'), url('georgia.ttf') format('truetype');
}
Thank you very much! The extreme slant on this otherwise beautiful font on my home page has been bothering me (and the web designer) for months. Solution seems almost embarrassingly obvious! Cheerz.