Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Fallback font style

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #42535
    iknowdavehouse
    Participant

    Hello! long time viewer, first time poster!

    I’m currently using 3 weights of a typeface from fonts.com. Using the medium licence the fonts are hosted on their server and linked through a dynamically created css file.

    I have defined all my styles using these fonts and for browser compatibility they all have a font-weight of normal. As I’m using a bold typeface, I’m not adding any weight to this in the CSS… now the fallback for all of these weights is Helvetica, Arial, Sans-serif and that’s the problem. I need to add font-weight just to the fallback fonts, especially as the typefaces won’t render offline (fonts.com needs it to be on the specified server).

    Has anyone got any advice? I really don’t want to add any weight to the webfonts as it’s typographically looking great across all browsers right now. I just need an adequate fallback!

    #122996
    Paulie_D
    Member

    As far as I know this is not something you can do with CSS alone.

    A JS solution is the answer I think…

    https://developers.google.com/webfonts/docs/webfont_loader

    #120641
    iknowdavehouse
    Participant

    Thanks for the links. I had everything working ok with font-face when I was using fonts locally for testing but to go live with that particular font we needed to use fonts.com. Unfortunately unless you want to pay 10 times the amount to host the fonts yourself you have to link to the CSS file on their server…and you can’t edit or add weights to it unfortunately…

    Will look into the js option, thanks!

    #126128
    iknowdavehouse
    Participant

    Just went through the Google / Typekit wf-loading JS solution and it’s working like a dream. Thanks Paulie_D.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.