Webfont font family avoiding faux-bold/italics

[dani]

Hi Forum,

I Want to use the font family Garamond (included on Mac).
The webfont is a backup for those who don’t have Garamond on the system (the mac default version).
So I converted and uploaded the files.

garamond.woff
garamond-italic.woff
garamond-bold.woff

PROBLEM: faux italics, faux bold

I want Garamond to act as a font-family with specific character sets for italic and bold.

I found this article that proposes a fix:

http://www.metaltoad.com/blog/how-use-font-face-avoid-faux-italic-and-bold-browser-styles

And here is my CSS

• {
  font-family: ‘Garamond’;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  }

@font-face {
font-family: ‘Garamond’;
src: url('http://www.anneslacik.com/wp-content/uploads/Garamond.woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: Garamond;
src: url('http://www.anneslacik.com/wp-content/uploads/Garamond-Italic.woff');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: Garamond;
src: url('http://www.anneslacik.com/wp-content/uploads/Garamond-Bold.woff');
font-weight: bold;
font-style: normal;
}

I left the Text Format font feild blank.

So my questions:

1. Is there a way to do this within the text formats?
2. is this going to cause any conflicts?

Thanks,
Daniel

[arminunruh]

Hey Daniel!

When you create a textformat, for each textformat it says: "HTML Class _NAMEOFFORMAT"
The html class is basically always the name with an underscore _ before it. So if you want to add extra css to a textformat:

._Default{
font-weight: normal;
font-style: normal;
}

Not sure if that helps with your problem as I haven't read the article that you linked.
Italic and font-weight is setable with textformats too.

[dani]

Hi Armin,
Yes, that helps. I'll add to existing CSS instead of trying to override it with universal selector.
Have a good day!