Hi,

 

I'm trying to use font-face but it isn't working.

 

In my CSS:

 

@font-face {font-family: Museo; src: url(fonts/Museo300-Regular.otf)}

p {font-size: 4em; font-family: Museo, arial; letter-spacing: -0.05em; text-align: center; color: #e9e9e9}

 

When I view the page it is fine obviously, as I have the font, but I just asked someone to send me a screen dump and it isn't working.

 

Any ideas?

It depends which browser he/she is using.

 

Browser compatibility

Browser Lowest version Support of

Internet Explorer 4.0 Embedded OpenType fonts only

Firefox (Gecko) 3.5 (1.9.1) TrueType and OpenType fonts only

3.6 (1.9.2) Web Open Font Format (WOFF)

Opera 10.0 TrueType and OpenType fonts only

Safari (WebKit) 3.1 (525) TrueType and OpenType fonts only

 

https://developer.mozilla.org/en/css/@font-face

http://www.evotech.net/blog/2010/01/font-face-browser-support-tutorial/

 

Internet Explorer and @font-face:

 

Internet Explorer has been implementing @font-face support since version 4*. In any event, it is defintely supported in IE6, IE7 and IE8. However, their implementation relies on Embedded Open Type (.eot), a proprietary format, which no other browsers use. To make IE users happy (which some could argue you shouldn’t, as a method to encourage them to upgrade), import EOT fonts in addition to TTF/OTF fonts, and included them as "fall backs" in the font family declaration (discussed in @font-face implementation below) . FontSquirrel is a place where you can convert fonts you can legally distribute to EOT (and SVG) format.

It depends which browser he/she is using.

 

Browser compatibility

Browser Lowest version Support of

Internet Explorer 4.0 Embedded OpenType fonts only

Firefox (Gecko) 3.5 (1.9.1) TrueType and OpenType fonts only

3.6 (1.9.2) Web Open Font Format (WOFF)

Opera 10.0 TrueType and OpenType fonts only

Safari (WebKit) 3.1 (525) TrueType and OpenType fonts only

 

https://developer.mozilla.org/en/css/@font-face

http://www.evotech.net/blog/2010/01/font-face-browser-support-tutorial/

 

Internet Explorer and @font-face:

 

Internet Explorer has been implementing @font-face support since version 4*. In any event, it is defintely supported in IE6, IE7 and IE8. However, their implementation relies on Embedded Open Type (.eot), a proprietary format, which no other browsers use. To make IE users happy (which some could argue you shouldn’t, as a method to encourage them to upgrade), import EOT fonts in addition to TTF/OTF fonts, and included them as "fall backs" in the font family declaration (discussed in @font-face implementation below) . FontSquirrel is a place where you can convert fonts you can legally distribute to EOT (and SVG) format.

 

Hey Wickham. He was viewing with Chrome. Thanks for the links, I'll take a look

will be interested to know if you get this working and what the issue is... if it would help we could check out the page?

Still isn't working. Tried font squirrel:

 

@font-face {font-family: 'Museo300Regular'; src: url(fonts/Museo300-Regular.otf) format('opentype');src: url('fonts/museo300-regular-webfont.eot'); src: local('☺'), url('fonts/museo300-regular-webfont.woff') format('woff'), url('fonts/museo300-regular-webfont.ttf') format('truetype'), url('fonts/museo300-regular-webfont.svg#webfontxKQ7vtVe') format('svg');font-weight: normal;font-style: normal;}

p {font-size: 4em; font-family: 'Museo300Regular', arial; letter-spacing: -0.05em; text-align: center; color: #e9e9e9;}

 

Grrrrrrrrrrrrrrrr.

 

I tried Fontforge, but the whole downloading of Cygwin just got ridiculous and I aborted the idea.