0

Possible Duplicate:
How would I use custom fonts in CSS

How can i use CSS to set a custom font type in, lets say, a <div> ?

I've seen something mentioned about @font-face ... but that doesn't seem to work in IE or Chrome.

Community
  • 1
  • 1
Yochai Timmer
  • 48,127
  • 24
  • 147
  • 185
  • Also [Non-Standard fonts in web?](http://stackoverflow.com/q/2969323) – Pekka May 07 '11 at 17:56
  • [This](http://www.css3.info/preview/web-fonts-with-font-face/) page works with me in chrome 11, and using the IE9 dev kit it appears to work for all versions of IE (although that may be wrong). – Matt May 07 '11 at 17:59

2 Answers2

1

Yes, @font-face would be the right way, but isn't fully support (by IE, sure).

You can relly on JavaScript to do it on "all" browsers. I suggest Cufón.

Erick Petrucelli
  • 14,386
  • 8
  • 64
  • 84
  • Nope, didn't work.. but Cufon looks nice – Yochai Timmer May 07 '11 at 18:21
  • Cufon looks nice, but you can't select text you're rendering with it. :/ – seler May 07 '11 at 18:30
  • Fail. I couldn't get any of this to work with non-english font (didn't try english font) – Yochai Timmer May 07 '11 at 18:31
  • On Cufón web page, remember to explicit specifies chars for special encodings, like **ã** **ü** **ç** etc. – Erick Petrucelli May 07 '11 at 18:45
  • @seler, it's right. Cufón doesn't allows text selection. Then I aways use it just for titles and places that my texts is "almost" an image but I don't want to crop images to do it. – Erick Petrucelli May 07 '11 at 18:47
  • What if you want custom font for whole page? http://socialcompare.com/en/comparison/comparison-of-web-fonts-solutions – seler May 07 '11 at 18:53
  • @seler, nice comparison. But sometimes the *.eot* file size will be very bigger than a Cufón generated *.js*. As I said, I use Cufón for titles and this kind of things. I never needed custom font to all text (Arial is so good). But yes, @font-face is very right to it. – Erick Petrucelli May 07 '11 at 19:02
1

@font-face is fully suported in every browser, even in ie. Notice, that some browsers need fonts to be converted to specific format. Use fontsquirrel to do that.

there's a yeasy way to register fonts with google webfonts

also you should read that

seler
  • 8,803
  • 4
  • 41
  • 54
  • Are there any limitations to the kinds of font i can use ? I've tried like 3 different custom fonts, and it didn't work – Yochai Timmer May 07 '11 at 18:09
  • @Yochai, As i said, different browsers use different formats of fonts. To get your font working in every browser you need to specify every format (.eot for IE) in your @font-face declaration. Fontsquirrel does it for you. – seler May 07 '11 at 18:25
  • That didn't work either.... seems like it won't work for hebrew font :( – Yochai Timmer May 07 '11 at 19:01
  • Ok answer- fontsquirrel Kit, Expert -> Custom Subsetting... -> choose Language – Yochai Timmer May 07 '11 at 19:17
  • Those are optimization options, which cut off potentially unused characters. Glad you did it. – seler May 07 '11 at 20:03