asked on

Firefox, webfonts: sometimes yes, sometimes no, on the same page.

I have several variants of ProximaNova installed on the server. I'm having this font problem in several areas of the cart, but I'll focus on the navigation bar.

This is the future home page, outside the cart. http://www.44steaks.com/index.shtml
The navigation font is set to ProximaNova-Bold, with the hover set to ProximaNova-Extrabld, and this is working, even in Firefox and IE8 on Windows.

This is the main page of the future cart: http://www.44steaks.com/angussteaks/
The navigation font is set to ProximaNova-Bold, the hover is set to ProximaNova-Extrabld. I am using the same web font style sheet, copied inside the cart, under the theme CSS so it is loaded automatically. The font file is under the CSS folder. The hover state works. The tab with the name of the cut of steak works, with the same ProximaNova-Bold. But in Firefox on both Mac and Windows, the navigation font shows up as something that looks like Times. There isn't a serif font declared in the entire set of stylesheets. The cart nav does at least show up as sans serif in IE8.

I ran the style sheet through the W3C validator, and it had some errors on -moz declarations, but nothing about fonts. The fonts are legal for the server. I have looked through every stylesheet that gets loaded by the cart, I don't see anything that could be overriding the navigation font.

I will be grateful for any help.

Thanks,
Lissa

deegoy418

I would suggest to embed the fonts instead of installing on server.... with embedding technique, you will not face this problem and all fonts will work find on all browser (IE7+, FF, Safari and Chrome and others.)

http://www.sean.co.uk/a/webdesign/embedding_fonts_in_webpages.shtm

ASKER CERTIFIED SOLUTION

Kim Walker

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

TheGrlGeek

ASKER

Thanks so much for the help, Experts!

deegoy418, I, the site designer, and the art director are working on Macs, and so are the main client and a lot of the customers for this particular site, so it didn't look like the WEFT embed would be guaranteed to work for all of us.

xmediaman, thanks for pointing me back to the CSS. The sheets in the site root aren't used in the cart, but the cart sheets had become a mangled mess through several design changes and were overriding each other in spots. Chrome was dealing with it, but the other browsers were giving up. I've removed lots of font-family specs that weren't needed.

Thanks again!
Lissa