Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Mar 2011
    Posts
    164
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Font Javascript and CSS - is this correct?

    Hi - I use javascript to render font which works great.

    However somtimes I notice that on some browsers it doesn't work and the end result is very ugly....this is rare but it does seem to happen.

    In my CSS I have the following:

    @font-face {
    font-family: 'TitilliumMaps26L002';
    src: local('../font/TitilliumMaps26L002-250wt') url('../font/TitilliumMaps26L002.otf') format('opentype');

    Should the red font CSS code I highlighted be a direct path like the send line? The second line is direct but perhaps this is my problem that sometimes a browser just doesn't pick up the path to the correct font within the javascript?

    Am I on the right track? Thanks!

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,726
    Thanks
    6
    Thanked 1,013 Times in 986 Posts
    No, the font-family property only contains the font name you use later in your stylesheet to display the font, and as a matter of fact you can choose whatever name you like, i. e. you could also write:
    Code:
    font-family: 'My super crazy CSS font';
    src: local('../font/TitilliumMaps26L002-250wt') url('../font/TitilliumMaps26L002.otf') format('opentype');
    As long as you use that later on, like, for example:
    Code:
    h1 {font: normal 18px "My super crazy CSS font", Arial, Helvetica, Sans-serif;}
    However, it could be that you suffer from the local reference issue explained, among other useful things, in this article by Paul Irish.
    Besides, your local reference is wrong anyway since you should not specify a path there but also reference the font name itself. This is because if other people have the font installed they don’t necessarily have the font installed where you have. The local reference is there so the font is taken from the user’s local hard drive before it’s downloaded.
    Last edited by VIPStephan; 03-21-2011 at 04:53 PM.

  • #3
    Regular Coder
    Join Date
    Mar 2011
    Posts
    164
    Thanks
    7
    Thanked 0 Times in 0 Posts
    thanks i really appreciate that -

    Very good to know that basically my problem was that I was trying to force a path, i.e. ..../font/ which it seems was wrong and hence the issues I have been having. That is probably the answer!

    Thanks again


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •