Problème @font-face

Bonjour à tous,
J'ai créé un petit site de présentation et j'utilise une fonte "exotique" sur mon site, mais elle ne fonctionne sur aucun navigateur (mis à part sur google chrome sur mon pc).

Voici mon code css :

@font-face { font-family: Comfortaa;
	src: url('Comfortaa.TTF');
}

font-family:  Comfortaa, MelbourneHelvetica, Arial, Verdana, sans-serif, Comfortaa, Melbourne; 
font-size:14px;
margin: 0;
padding: 0;
color: #000;
}

Un exemple sur :

li errors{
	font-size:15px;
font-family:Comfortaa;
}

J'ai regardé un peu partout mais je ne trouve rien, du coup je commence à baisser les bras

Abioze
Modifié par Abioze (17 Oct 2013 - 14:06)

Pour que cela fonctionne sur tous les navigateur il faut ajouté les formats .eot (iE) et .woff

un petit tour là: http://www.alsacreations.com/astuce/lire/630-fonte-personnalisee-site-web.html
et là: http://css.mammouthland.net/css3/font-face.php

et fontsquirrel te convertit la police et en plus te fournit un code fontface très bien fait

Je vous remercie pour vos réponses, je vais essayé ça et je vous tiens au courant.

Voici par exemple une déclaration correcte pour une font dénommée "ValentinaRegular" :

@font-face {
    font-family: 'ValentinaRegular';
    src: url('../fonts/Valentina/valentina-regular.eot');
    src: url('../fonts/Valentina/valentina-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Valentina/valentina-regular.woff') format('woff'),
         url('../fonts/Valentina/valentina-regular.ttf') format('truetype'),
         url('../fonts/Valentina/valentina-regular.svg#valentinaregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

Il faut bien sûr disposer de chaque polices correspondantes (avec par exemple l'outil Font Squirrel Générator susnommé plus haut) et corriger les chemins.

j'avais un pb d'affichage des font google sur certain navigateur aussi j'ai résolu le pb en changeant le lien http par https
par exemple :
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,600" rel="stylesheet" type="text/css" />
voilà