Hi,

I'm trying to use the @font-face selector (because it finally works in most browsers... yay!), but am having a hard time.

I've tried importing it from a stylesheet using @import in HTML/CSS inserts. No go.
I've treid adding it directly (as opposed to importing) in the same location - HTMl Header: inserts :

<style type="text/css" media="all">
@import {url('<?php bloginfo('wpurl'); ?>/wp-content/fonts/stylesheet.css');}
@font-face {
	font-family: 'TangerineRegular';
	src: url('Tangerine_Regular.eot');
	src: local('‚ò∫'), url('Tangerine_Regular.woff') format('woff'), url('Tangerine_Regular.ttf') format('truetype'), url('Tangerine_Regular.svg#webfonthdkJyIIt') format('svg');
	font-weight: normal;
	font-style: normal;
}
</style>

and in CSS inserts. Still no go.

In "Body styles", I've got just:
font-family: "TangerineRegular", arial, sans-serif;

and all text is defaulting to some sans-serif font, which tells me it is reading that information, at least, but clearly not understanding it so it's going to default.

Clear as mud?

The point is, this should be working (I would think?) but it's not. Has anyone found a solution to this yet? It doesn't make any sense, unless the programming is, perhaps stripping out the "@" symbol?

Thanks.

P.S. the stie can be seen with the theme I'm testing here:
http://brownstudy.littlesumrallacade...e=atahualpa353

Thanks again!

I have the same question, any answers?

Oh! Yes, actually. Let's see...

First off, I chose not to import a premade stylesheet defining the fonts. Instead, inside HTML Inserts: Header, I pull every font I want to use, for instance:

<style type="text/css" media="all">
@font-face {
	font-family: "FontinSmallCapsRegular";
	src: url('/wp-content/fonts/fontin-smallcaps.eot');
	src: local('‚ò∫'), url('/wp-content/fonts/fontin-smallcaps.woff') format('woff'), url('/wp-content/fonts/fontin-smallcaps.ttf') format('truetype'), url('/wp-content/fonts/fontin-smallcaps.svg#webfontj5eFE88C') format('svg');
	font-weight: normal;
	font-style: normal;
}
</style>

Notice this: I've enclosed the font-family's name in double quotes, not single quotes. Single quotes gave me problems in another place, so I made sure to always use doubles:

	font-family: "FontinSmallCapsRegular";

Finally, I made sure to use the appropriate CSS call to actually use the font in my general text. This is what I have in CSS Inserts:

.post-bodycopy {
font: 16px "FontinRegular";
line-height: 1.5em;
}

Again, notice the double quotes.

If you're styling the blog title and/or tagline, of course, make those adjustments in "Style & Edit Header Area". for instance, in "Blog Title":

font: 60px/240% "FontinSmallCapsRegular", Tahoma, Arial, sans-serif;

Nope, not sure about the double-font size thing, but it seems to be working. Anyway, double-quotes there too.
Oh! One more thing I just remembered, for some reason it will NOT work if you separate the font elements. For instance:

font-family: "FontinSmallCapsRegular", Tahoma, Arial, sans-serif;
font-size: 60px;
etc.

won't work, even though it means the same thing as the original line. I don't know why.
HTH!