embedding fonts

[unistake]

Hi all,

 

I am trying to add three fonts to a website, they work however when checking on http://jigsaw.w3.org/ if the CSS is valid it comes up with:

 

Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in : "aspire" "aspire"

5 Property src doesn't exist : url('http://www.sweet-tea.co.uk/aspire.ttf') url('http://www.sweet-tea.co.uk/aspire.ttf')

8 Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in : dp dp

9 Property src doesn't exist : url('dp.ttf') url('dp.ttf')

12 Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in : braditc braditc

13 Property src doesn't exist : url('braditc.ttf') url('braditc.ttf')

 

Does anyone know why would not be validating?

 

Many thanks

 

The CSS code I have is:

 

@font-face {
    font-family: "aspire";
    src: url('http://www.sweet-tea.co.uk/aspire.ttf');
}
@font-face {
    font-family: dp;
    src: url('dp.ttf');
}
@font-face {
    font-family: braditc;
    src: url('braditc.ttf');
}

[JasonLewis]

Because it's not valid CSS 2.1. Sure it'll work, and it's quite valid, but @font-face has only really gained support in Firefox and Opera within the last few years. It's the same when doing things like border-radius, or -moz-border-radius and what not. Don't fret to much.

[SuperBlue]

Don't worry about CSS validity to much, browsers will just ignore the stuff they don't understand.

 

You shouldn't break the syntax though, as that could lead to rendering issues.

[haku]

Kind of a side note, but you should make sure you have the legal right to put those fonts on the web - many fonts are not authorized for web use, even if you have purchased the font.

[unistake]

thanks for the tips.

 

@ Haku, I will check them now - thanks for the heads up