I have .ttf and .eot versions of the fonts I'm trying to use, and the fonts are displaying properly in Chrome, Firefox, Safari, and Opera. In IE however, it shows Arial.

The page is visible at: http://www.itnetpros.com

Here are the font-face rules and one of the elements that should be using the fonts in my css:

@font-face {
	font-family: humnst777;
	src: url(../fonts/Hum777l.ttf), url(../fonts/Hum777l.eot);
}
@font-face {
	font-family: humnst777n;
	src: url(../fonts/Hum777n.ttf), url(../fonts/Hum777n.eot);
}

h1 {
	font: 100 30px/30px humnst777, Arial, Helvetica, sans-serif;
	color: #393e47;
	margin: 0 30px;
	padding: 80px 0 0 0;
}

If anyone could tell me what I'm missing, it would be greatly appreciated.

The first and most important question is: Which versions of IE?

Here's a recent article on the subject you may find useful:

http://www.smashingmagazine.com/2011...useful-tricks/

Of particular importance is this, quoted from the article:

EOT is exclusively supported by Internet Explorer. Even though it might not succeed as a Web font format in the future, it still makes sense to use this format today in order to supply the users of various IE versions with Web fonts. Current IE versions (< 9) do not use any other format.


If you want to convert TTF fonts to natively compressed EOT files, you can use EOTFast (a free application) currently available only for Windows.

tim

It does not work in any version of IE. I'm still a bit confused on what your referring to in the article. I've uploaded ttf and eot formats and put them both in my @font-face rule.

Is there something else I passed up in the article or that I've forgotten to include?

You might want to try putting the rule in a separate IE-only stylesheet called by conditional comments. If you always do that presuming IE will always find a way to mess it up otherwise, know that 90-99.999% of the time you'll be right.