Problem implementing @font-face in phpMyDirectory

Get Started
1

URL of the directory: http://tinyurl.com/4clortv
URL of the main site: http://tinyurl.com/4k92ofa

I am trying to make the directory, which is powered by phpMyDirectory, match the main site design. I’m almost there, but I’m having trouble with the navigation font.

I used the Font Squirrel @font-face generator. In the main site (powered by WordPress), I added a fonts folder to the theme folder and then added the following to my CSS:


@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('fonts/league_gothic-webfont.eot?') format('eot'),
         url('fonts/league_gothic-webfont.woff') format('woff'),
         url('fonts/league_gothic-webfont.ttf') format('truetype'),
         url('fonts/league_gothic-webfont.svg#webfontwcR6rlLx') format('svg');
    font-weight: normal;
    font-style: normal;

}

It works perfectly for WordPress, but not so much for the directory. Firefox is not even acknowledging the new font. Chrome & Safari have the font, but the whole navigation is misplaced. IE is just plain messed up (though the new font does show). Opera, on my computer, seems to be the only one playing nicely.

Can someone help me sort this out? I’d be so grateful… :slight_smile:

2

I changed the doctype for the directory which made IE behave like all the others. At this point, each browser (except Firefox) seems to be showing the new font, though the navigation is positioned incorrectly. Firefox is just not playing well at all. Ideas?