Need help with CSS and fonts

sjnoel

Hi everyone,

I'd appreciate any help on this. I'm having trouble with fonts on my new smugmug customization.

On our website, www.cmewebsites.com, we are using Franklin Gothic Demi Condensed. We're using a font kit that's been uploaded to our server. It works fine in all browsers.

We added it to our smugmug customization: cmewebsites.smugmug.com Knowing that we can't upload a font kit, we added the CSS with a hard reference to the font kit that's functioning on our server.

Yet it only works in Chrome. It doesn't work in IE or FF. We've set a secondary font (Oswald) that works in IE an FF (coming from Google fonts). It seems to me we must be calling it right when it works in Chrome.

This is how we're calling the font in the Entire Site CSS file:
@font-face {
font-family: 'franklin_gothic_demi_condRg';
src: url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.eot');
src:
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.woff') format('woff'),
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.ttf') format('truetype'),
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.svg#franklin_gothic_demi_condRg') format('svg'),
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.eot?#iefix') format('embedded-opentype');
}

Anybody have any ideas?

Thanks,
Jane

Hikin' Mike

I posted something on your other thread. I'm also using @font-face on my site, and it works for me.

@font-face code

/**
* Fonts
***************************************************/
@font-face {
    font-family: 'muliregular';
    src: url('http://www.thebackcountry.org/fonts/muli-regular-webfont.eot');
    src: url('http://www.thebackcountry.org/fonts/muli-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://www.thebackcountry.org/fonts/muli-regular-webfont.woff') format('woff'),
         url('http://www.thebackcountry.org/fonts/muli-regular-webfont.ttf') format('truetype'),
         url('http://www.thebackcountry.org/fonts/muli-regular-webfont.svg#muliregular') format('svg');
    font-weight: normal;
    font-style: normal;
    }    
@font-face {
    font-family: 'open_sans_condensedbold';
    src: url('http://www.thebackcountry.org/fonts/opensans-condbold-webfont.eot');
    src: url('http://www.thebackcountry.org/fonts/opensans-condbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://www.thebackcountry.org/fonts/opensans-condbold-webfont.woff') format('woff'),
         url('http://www.thebackcountry.org/fonts/opensans-condbold-webfont.ttf') format('truetype'),
         url('http://www.thebackcountry.org/fonts/opensans-condbold-webfont.svg#open_sans_condensedbold') format('svg');
    font-weight: normal;
    font-style: normal;
    }

font-family code:

#menu-primary li a {
    display: inline-block;
    padding: 12px 25px;
    color: #d9984a;
    font-family: Muli,sans-serif;
    text-decoration: none;
    }

#myBreadcrumbs a {
    color: #d9984a;
    font-family: 'Open Sans Condensed',sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: .875em;
    }

Hikin' Mike

Also, I noticed your from Pittsburgh. I used to live about 30 minutes from Pittsburgh.

sjnoel

Thanks Mike. I responded on the other post too. Didn't mean to start two of them. I posted and kept looking for an answer so pinged on Eric's post.

I'm about 40 minutes from Pittsburgh (to the east). Where did you used to live?

Pittsburgh is a pretty city, but sure can't compare with your landscapes! Some beautiful photos on your site.

Thanks,
Jane

Hikin' Mike

I lived in Murrysville. I still have family there, so I go back every few years. Planning on visiting my parents (50th Wedding Anniversary) some time this summer.

I'll respond to your font question on the other thread.

leftquark

sjnoel wrote: »

Hi everyone,

I'd appreciate any help on this. I'm having trouble with fonts on my new smugmug customization.

On our website, www.cmewebsites.com, we are using Franklin Gothic Demi Condensed. We're using a font kit that's been uploaded to our server. It works fine in all browsers.

We added it to our smugmug customization: cmewebsites.smugmug.com Knowing that we can't upload a font kit, we added the CSS with a hard reference to the font kit that's functioning on our server.

Yet it only works in Chrome. It doesn't work in IE or FF. We've set a secondary font (Oswald) that works in IE an FF (coming from Google fonts). It seems to me we must be calling it right when it works in Chrome.

This is how we're calling the font in the Entire Site CSS file:
@font-face {
font-family: 'franklin_gothic_demi_condRg';
src: url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.eot');
src:
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.woff') format('woff'),
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.ttf') format('truetype'),
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.svg#franklin_gothic_demi_condRg') format('svg'),
url('http://www.cmewebsites.com/template_dwt/fonts/14359-webfont.eot?#iefix') format('embedded-opentype');
}

Anybody have any ideas?

Thanks,
Jane

Hi Jane,
It looks like you have the code in the correct format, based on my knowledge of how the font's are downloaded to the browser using CSS. My only guess is that perhaps the files themselves are the problem (the .eot file or the .ttf, etc). Otherwise it looks like you've got it fine.

sjnoel

Hikin' Mike wrote: »

I lived in Murrysville. I still have family there, so I go back every few years. Planning on visiting my parents (50th Wedding Anniversary) some time this summer.

I'll respond to your font question on the other thread.

Well isn't that something! I live in Grapeville - a very town just outside Greensburg. We go through Murrysville regularly and have clients there. It's a nice place!

Congrats on your parent's 50th. We did that a few years go. My parents are in the Irwin area (1 turnpike exit from Monroeville.)

sjnoel

Thanks Aaron. I'll give that a try.

Hikin' Mike

sjnoel wrote: »

Well isn't that something! I live in Grapeville - a very town just outside Greensburg. We go through Murrysville regularly and have clients there. It's a nice place!

Congrats on your parent's 50th. We did that a few years go. My parents are in the Irwin area (1 turnpike exit from Monroeville.)

My parents were born in Greensburg and most of my relatives still live in Greensburg and Latrobe. My parents live in Jeanette now. Small world.

sjnoel

Wow that is a small world. From the hill where I'm sitting, I can look over at Jeannette on the next hill over. Thanks for all your help.