6 replies [Last post]
webecho
webecho's picture
Offline
newbie
Deep down under
Last seen: 7 years 25 weeks ago
Deep down under
Timezone: GMT+8
Joined: 2007-02-09
Posts: 8
Points: 10

Hi Guys
Been a long time since I've been here, good to see some familiar names while searching for an answer.

I'm using Tangerine from the Google font API.

Tangerine has a small main body and long / tall ... ahem ... uppy/downy bits (couldn't find out what they're called)
See example http://www.google.com/webfonts/family?family=Tangerine

My problem is that Tangerine needs to be at 2.3em to be big enough on screen, however, when I view this on a browser that doesn't support @font-face then the fallback fonts are huge.

Has anyone come across this yet?
Switching default font size after finding out whether browser supports @font-face is a solution, but if I can avoid using javascript I'd prefer not to.

It's not been an issue with other fonts I've used, but Tangerine has such exaggerated uppy/downy bits that's it's causing a big layout problem.

Anyone have any ideas?

Thanks

@webecho

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 3 weeks 2 days ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2054
Points: 2286

webecho wrote: ... uppy/downy

webecho wrote:

... uppy/downy bits (couldn't find out what they're called) ...

Translation: ascenders/descenders. Laughing out loud

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 3 weeks 2 days ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2054
Points: 2286

To answer the question, some

To answer the question, some fonts just have different EM sizes. You have to choose backups with similar sizing if sizing is important to the design.

webecho
webecho's picture
Offline
newbie
Deep down under
Last seen: 7 years 25 weeks ago
Deep down under
Timezone: GMT+8
Joined: 2007-02-09
Posts: 8
Points: 10

Ha ha, nice one. I should've

Ha ha, nice one.
I should've been able to guess that really eh?

Hmmm - I guess that puts tangerine out of the equation then, nothing standard has anything like those proportions

webecho

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 8 years 8 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Which browsers don't support

Which browsers don't support @font-face? I thought there was about 95-98% coverage.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

slimcreations
slimcreations's picture
Offline
Regular
Last seen: 11 years 39 weeks ago
Joined: 2011-01-02
Posts: 13
Points: 13

I think ie6 has probs with

I think ie6 has probs with @fontface

Ive started to use cufon fonts instead, seems to work great on all browsers including ie6, although i try to keep it to a minimum when using as i'm worried it may affect my seo. Probably best to use if your more intrested in the design rather than seo.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 8 years 8 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

slimcreations wrote: I think

slimcreations wrote:

I think ie6 has probs with @fontface

No it doesn't. IE uses EOTs which it's actually supported since version 4, so much longer than any other browser.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference