CSS font-face not accepting 'format' syntax

Question

I am putting a custom font (Alef-Regular) in my stylesheet, with the following code (... represents longer path, not actual code).

@font-face
{
    font-family: Alef;
    src:
        url('.../Alef-Regular.ttf') format ('truetype'),
        url('.../Alef-Regular.woff') format ('woff');
}

This does not work when I call the font. Firefox gives the following warning:

Expected end of value but found 'format'.  Skipped to next declaration.

However, when I remove the formats and strip it down to:

@font-face
{
    font-family: Alef;
    src: url('.../Alef-Regular.ttf');
}

Then it works just fine.

I double-checked and triple-checked, and the syntax in the first example appears to be correct. Am I missing something in the syntax, or could there be a problem elsewhere?

Answer 1

You have to leave no space between the 'format' word and the parenthesis.

Like that :

@font-face
{
    font-family: Alef;
    src:
        url('.../Alef-Regular.ttf') format('truetype'),
        url('.../Alef-Regular.woff') format('woff');
}