18041 sujets

Questions générales et questions de débutants

[Résolu] Problème @font-face

Salut à tous j'ai un petit problème, j'utilise deux fonte pour mon site, mais aucune d'elles marche sur Firefox 17 & Google Chrome pour Jelly Bean 4.2. Il arrive aussi qu'IE 9 & 10 ne les prennent plus en compte à la moindre modification de @font-face.

Serveur cobaye : dovakhin.dofus.free.fr

Voici le css : 
@font-face {
font-family:"candara";
src:url('fonts/candara.ttf');
src:url('fonts/candara.eot') format ('eot');
src:url('fonts/candara.otf') format('truetype');
src:url('fonts/candara.ttf') format('truetype');
src:url('fonts/candara.woff') format('woff');
src:url('fonts/candara.eot?#iefix') format('embedded-opentype');
src:url('fonts/candara.svg#cordiaupcbold') format('svg');
src: local('candara'), local('candara'), url('fonts/candara.ttf') format('ttf'), url('fonts/candara.ttf') format('truetype');
font-style:normal;
font-weight:normal;
}

@font-face {
font-family:"cordiaupcbold";
font-weight:normal;
font-style:normal;
src:url('fonts/cordiaub-webfont.eot'); format ('eot');
src:url('fonts/cordiaub-webfont.otf') format('truetype');
src:url('fonts/cordiaub-webfont.ttf') format('truetype');
src:url('fonts/cordiaub-webfont.woff') format('woff');
src:url('fonts/cordiaub-webfont.eot?#iefix') format('embedded-opentype');
src:url('fonts/cordiaub-webfont.svg#cordiaupcbold') format('svg');
src:local('cordiaub-webfont'), local('cordiaub-webfont'), ('fonts/cordiaub-webfont.ttf') format('truetype');
}


Par exemple sur : 
li#bienvenue {
display:inline-block;
width:80%;
height:100%;
padding-top:1em;
font-family:"candara", Arial, Helvetica, sans-serif;
font-size:0.75em;
text-align:justify;
color:#666;


J'ai cherché pas mal sur le net et la doc mozilla, cela ne donna rien de neuf.
Modifié par Lart-iste (11 Dec 2012 - 12:37)
Bonjour,

Je me demande si l'erreur ne vient pas de ta déclaration:
font-family:"candara";

Alors que je verrais : font-family:candara;
rodolpheb a écrit :
Bonjour,

Je me demande si l'erreur ne vient pas de ta déclaration:
font-family:"candara";

Alors que je verrais : font-family:candara;


Ne donne toujours rien sous FF Smiley decu
Une petit erreut peut-être:
src:url('fonts/candara.svg#cordiaupcbold') format('svg');
plutôt
src:url('fonts/candara.svg#candara') format('svg');
Bonsoir.

Le nom de la police, c'est candara ou Candara ? CSS est sensible à la casse.

Essaie font-family: Candara;
rodolpheb a écrit :
Une petit erreut peut-être:
src:url('fonts/candara.svg#cordiaupcbold') format('svg');
plutôt
src:url('fonts/candara.svg#candara') format('svg');


Erreur bête corrigé, mais ne marche toujours pas

thierry a écrit :
Bonsoir.

Le nom de la police, c'est candara ou Candara ? CSS est sensible à la casse.

Essaie font-family: Candara;


Plus aucun "Candara" n'existe seulement des "candara", mais à priori rien de neuf
A votre place, pour ne pas me casser la tete trop longtemps, je copierais un code FontSquirel texto et je remplacerais juste le nom de la police générique par celle utilisée. Évidemment il faut avoir en réserve les polices appelées. Les convertir au besoin.
rodolpheb a écrit :
Regarde sur ce site: font-face-problem-with-firefox


Peut que sa viens de la, mais moi et l'anglais sa fait deux même avec le franglais de google traduction c'est pas le top enfin bon, j'vais tenté sans grande conviction :x

Olivier C a écrit :
A votre place, pour ne pas me casser la tete trop longtemps, je copierais un code FontSquirel texto et je remplacerais juste le nom de la police générique par celle utilisée. Évidemment il faut avoir en réserve les polices appelées. Les convertir au besoin.


Toujours pas :x
Le code marche chez moi ainsi :

@font-face {
    font-family: 'GoodDogRegular';
    src: url('GoodDog-webfont.eot');
    src: url('GoodDog-webfont.eot?#iefix') format('embedded-opentype'),
         url('GoodDog-webfont.woff') format('woff'),
         url('GoodDog-webfont.ttf') format('truetype'),
         url('GoodDog-webfont.svg#GoodDogRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

p
{
	font-family:"GoodDogRegular";
	font-size:1em;
	color:#3d2512;
}



T'as bien les 4 types de fichiers sur ton serveur (eot, woff, ttf et svg), au bon endroit -même répertoire que le css ?
Hello.
Lothindil a écrit :
T'as bien les 4 types de fichiers sur ton serveur (eot, woff, ttf et svg), au bon endroit -même répertoire que le css ?
Je pense que le souci vient de là. L'onglet réseau de Firebug me donne une 404 pour le .woff et le .ttf.
Modifié par Florian_R (11 Dec 2012 - 12:27)
Ah O.o je retest :O

Reuh : Sujet résolu sa les fontes & css devait obligatoirement être dans le même répertoire :x
Modifié par Lart-iste (11 Dec 2012 - 12:52)
Olivier C a écrit :
Ah oui bien sûr... il faut avoir les fonts...


j'aurais aimer pouvoir garde les css et les fontes dans deux répertoire différent pour avoir une arborescence plus propre.
Lart-iste a écrit :
j'aurais aimer pouvoir garde les css et les fontes dans deux répertoire différent pour avoir une arborescence plus propre.

Ben... oui, personnellement c'est ce que je fais toujours, je ne vois pas où est le problème (un problème de chemin peut-être ?).
Olivier C a écrit :

Ben... oui, personnellement c'est ce que je fais toujours, je ne vois pas où est le problème (un problème de chemin peut-être ?).


Surement oui mais bizarrement sa marche niquel sous ie 9&10, Chrome et opéra mais pas firefox, enfin bon tant que sa marche sa me va ^^.
Sujet clos
Aller à