two @font-face not acting like each other

问题:

I'm using two @font-face in CSSreset.css exactly like each other, and just one of them works! This is the style code:

@font-face {
        font-family: 'B Mitra';
        src: url('./fonts/B Mitra.eot');
        src: url('./fonts/B Mitra.eot?#iefix') format('embedded-opentype'),
        url('./fonts/B Mitra.woff') format('woff'),
        url('./fonts/B Mitra.ttf') format('truetype'),
        url('./fonts/B Mitra.svg#webfont') format('svg');
    }

@font-face {
        font-family: 'BBCNassim';
        src: url('./fonts/BBCNassim.eot');
        src: url('./fonts/BBCNassim.eot?#iefix') format('embedded-opentype'),
        url('./fonts/BBCNassim.woff') format('woff'),
        url('./fonts/BBCNassim.ttf') format('truetype'),
        url('./fonts/BBCNassim.svg#webfont') format('svg');
    }

The second @font-face not working well. this is how I use them in my stylesheet:

#Download > a {
        font-family: 'BBCNassim';
    }

This is not working and shows "tahoma" font. the wierd part is, if the "BBCNassim" font not load correctly, the default browser font shows. So, when I use font-family: 'BBCNassim';, the font will be tahoma.

This is the "B Mitra" font witch shows and load correctly:

#Map_Eshterak {
        font-family: 'B Mitra';
    }

SCREENSHOT: http://i.imgur.com/UXmSOmJ.jpg

The problem is not from the font; because if i copy "B Mitra" fonts, and change the name to "BBC Nassim", the same thing will happen.

• this is my directory : http://i.imgur.com/xV6R8lw.png

回答1:

Could it be the CSS selectors you're using? Does it work if you change your code to:

#Map_Eshterak {
        font-family: 'BBCNassim';
}

And as a side-note, once you get this working you may want to give a font stack, in case your @font-face fonts don't load properly. (For example, font-family: 'BBCNassim', Helvetica, sans-serif; will show Helvetica is BBCNassim isn't available)