We're calling on all EU-based Mozillians with iOS or iPadOS devices to help us monitor Apple’s new browser choice screens. Join the effort to hold Big Tech to account!

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Hierdie gesprek is in die argief. Vra asseblief 'n nuwe vraag as jy hulp nodig het.

Firefox displaying a different font on personal website than the one that is intended.

  • 4 antwoorde
  • 1 het hierdie probleem
  • 1 view
  • Laaste antwoord deur Peter Plant

more options

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?

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?

Gekose oplossing

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');
}
Lees dié antwoord in konteks 👍 1

All Replies (4)

more options

Do you have installed the font on your devices? Or are you using an URL link from a font webpage?

more options

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.

more options

Gekose oplossing

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');
}
more options

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.