@fontface not working on Firefox

Discussion in 'HTML & Website Design' started by XeBii, Sep 5, 2011.

  1. #1
    XeBii, Sep 5, 2011 IP
  2. xira

    xira Active Member

    Messages:
    315
    Likes Received:
    8
    Best Answers:
    4
    Trophy Points:
    68
    #2
    To have a font work online (including Internet Explorer, which you didn't mention) you need to have a few file types (eot, woff, tvg and svg). These are usually supplied when you download an internet font to use on your site within a zip file or other package. Within your CSS (or a separate page of CSS) you then have to declare your font files and where they are located:

    @font-face {
    font-family: 'FuroreRegular';
    src: url('Furore-webfont.eot');
    src: url('Furore-webfont.eot?#iefix') format('embedded-opentype'),
    url('Furore-webfont.woff') format('woff'),
    url('Furore-webfont.ttf') format('truetype'),
    url('Furore-webfont.svg#FuroreRegular') format('svg');
    font-weight: normal;
    font-style: normal;
    }

    Once you do this, you can call your font from your mail CSS simply by naming it (in quotes).
    font-family: 'FuroreRegular', Arial, sans-serif;

    When I looked at your CSS, I could only find the main CSS included within your HTML page. :-s
    I am assuming you are using some kind of CMS, because as a general rule of thumb, it's not a good idea to put all your CSS within each page like that.
    Regardless, I could not find the CSS that declares your font files.

    Hope this helps
     
    xira, Sep 5, 2011 IP
  3. XeBii

    XeBii Peon

    Messages:
    77
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thank you for the fast Response!

    i've uploaded the zip file and all its contents from where i downloaded

    and in my Blogs Page here is the Stylesheet linked

    <link charset='utf-8' href='http://www.youthkorner.com/xnys/webfonts/fonts.css' media='all' rel='stylesheet' type='text/css'/>

    This Fonts works fine in Google Chrome and IE too :p

    Only FireFox not Displaying that Font
     
    XeBii, Sep 6, 2011 IP