Embedded font distorted only in Firefox 4.0.1
I'm finishing up a Wordpress website that uses Eurostile as an embedded font. It shows up beautifully in all browsers except Firefox 4.0.1 (OSX, and I'm assuming in Windows also, but on a mac, so can't check). In FF4.0.1, the navigation and section headings are completely mangled! I'm pretty sure something with the font is the problem, because when I comment out the @font-face statement in my CSS, the nav and headings render fine, but if the file was corrupt, I'd expect to see this problem show up cross-browser.
I've gone through and cleared the cache, started FF in safe mode, checked the minimum font setting is "none" and all the other standard suggestions, but the problem persists.
I've been banging away at this for days - any help is much appreciated!
Wót jaffy
Wšykne wótegrona (3)
It's strange that it looks perfectly normal with JavaScript disabled (I use the NoScript add-on), but when I enable scripting, the font is substituted (or it's attempted) and... not so good (on Windows 7).
I don't know enough about how @font-face works to help track down the problem. You can find more web development help on the mozillaZine Web Development board. Separate forum, separate registration. Please note the tips in the Sticky Post at the top of the forum before posting.
Thanks jscher2000, I appreciate you replying! I tried disabling JS too, but the problem still persisted for me. I'll try the forums you suggested too, but would still love any help from anyone in here!
In case anyone else encounters the same issues, I ended up using a substitute font that was almost identical to what I'd used in the design. Shame, really, but I'm relieved I could find a stand-in!