@font-face: bold in FF is bolder than in Chrome

Question

I used this code:

@font-face {
    font-family: \'DroidSansRegular\';
    src: url(\'droidsans-webfont.eot\');
    src: url(\'droidsans-webfont.eot?#iefix\') for         


        

Answer 1

You have specified two faces in two different families. You have defined a regular face in a family called “DroidSansRegular” and you have defined a bold face in a family called “DroidSansBold”. The design of CSS expects you to define those as two weights of one family. If you make both say font-family: "DroidSans";, then you can use a font family called “DroidSans” and when you ask for bold, you get the bold face from that family.

(Oops. The chosen answer already gave the correct solution but didn’t quite explain what was wrong.)