18041 sujets

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

[Résolu] Police TrueType ne s'affichant pas dans Firefox

Pages :
Bonjour ! J'ai un document HTML représentant un échiquier au moyen d'une police TrueType. L'échiquier s'affiche correctement dans Internet Explorer mais pas dans Firefox. Donc j'imagine qu'il y a quelque chose qui ne va pas dans mon code. Pourriez-vous m'aider à le corriger ?

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
p#pchessboard {font-family: chess alfonso-x; font-size: 20px; color: black;}
p {font-family: courier new; font-size: 16px; color: black;}
</style>
<!--
Chess Alfonso-X
True Type font by Armando H. Marroquin
 http://www.enpassant.dk/chess/fonteng.htm
 
-->
</head>
<body>
<p id="pchessboard">
!""""""""#<br>
$tMvWlVmT%<br>
$OoOoOoOo%<br>
$ + + + +%<br>
$+ + + + %<br>
$ + + + +%<br>
$+ + + + %<br>
$pPpPpPpP%<br>
$RnBqKbNr%<br>
/(((((((()<br>
</p>
</body>
</html>

Modifié par Roland57 (01 Mar 2016 - 17:28)
Modérateur
Bonjour,

Qu'est-ce qui ne marche pas avec firefox exactement ?

EDIT : si c'est juste un espace qui apparait entre chaque ligne dans ton firefox, essaie ça :
#pchessboard {
	font-family: 'chess alfonso-x';
	font-size: 20px;
	color: black;
	line-height: 1;
}
Amicalement,
Modifié par parsimonhi (29 Feb 2016 - 13:40)
Salut

J'imagine que tu utilise un font family que tu as télécharger depuis l’extérieur, peut être devrais-tu préciser la source de celui ci :

 @font-face {
      font-family: "name"; // Le nom que tu veux donner à ton font
      src: url("ton chemin .ttf"); // le path de ton fichier font 
    }
Modérateur
Bonjour,
JENCAL a écrit :
Salut

J'imagine que tu utilise un font family que tu as télécharger depuis l’extérieur, peut être devrais-tu préciser la source de celui ci :

 @font-face {
      font-family: "name"; // Le nom que tu veux donner à ton font
      src: url("ton chemin .ttf"); // le path de ton fichier font 
    }
Hum, si ça marche avec IE, il y a peu de chance que ce soit ça le problème, non ?

Amicalement,
Modifié par parsimonhi (29 Feb 2016 - 14:05)
Je préféré précisé, car pour moi cela me parait déjà assez étrange que sur IE cela fonctionne sans mentionné la source (et à l'occasion le format TrueType).
J'ai eu le cas avec le symbole diamètre, ça passait sur Chrome et Firefox et pas sur IE. Ca venait d'une déclaration type UTF8 de tête ...

Maintenant, je contrôle Firefox et IE pour voir si ça passe bien.

Regarde bien si tu sa bien mis les ' ' lors de ta déclaration de type de police. 'Arial'


p#pchessboard {font-family: 'chess alfonso-x'; font-size: 20px; color: black;}

A mon avis ça vient de l'espace entre chess alfonso, j'ai eu le cas !!! Si tu mets '' le programme voit qu'il faut lire entre les guillemets.
Modifié par Tintin75 (29 Feb 2016 - 16:18)
Merci pour vos réponses.

Oui, c'est une police que j'ai trouvée sur un site. L'adresse est en commentaire dans le code. La police est installée sur mon ordinateur.

J'ai eu bon espoir que de rajouter des guillemets soit la solution mais non, ça ne change rien.

Voici ce que je vois dans IE :

upload/55170-ie.png

et dans Firefox :

upload/55170-firefox.png
Si tu fais un clik droit -> inspecter element , as-tu une erreur dans l'onglet "console" ? sous firefox je parle.
JENCAL a écrit :
Si tu fais un clik droit -&gt; inspecter element , as-tu une erreur dans l'onglet "console" ? sous firefox je parle.


Tiens, je ne connaissais pas ça. Voici ce qui est écrit :

"L'encodage de caractères du document HTML n'a pas été déclaré. Le document sera affiché avec des caractères incorrects pour certaines configurations de navigateur si le document contient des caractères en dehors de la plage US-ASCII. L'encodage de caractères de la page doit être déclaré dans le document ou dans le protocole de transfert."

Bon, c'est clair. Je vais essayer de spécifier l'encodage.
C'est ce que je t'avais dit. J'ai eu le cas avec IE et mes symboles spéciaux.

Déclare ton encodage et ça devrait s'afficher. Smiley cligne
Modifié par Tintin75 (29 Feb 2016 - 18:46)
Même en déclarant l'encodage, ça ne va toujours pas. Smiley confus

J'ai essayé comme ceci :

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> 
<style type="text/css">


et comme cela :

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1"> 
<style type="text/css">


en ayant soin de convertir à chaque fois mon fichier dans l'encodage correspondant.
Tintin75 a écrit :
envoi ton code complet, que l'on voit.

Merci Smiley smile


Merci à vous plutôt. Smiley smile

Le code complet est celui que j'ai cité dans mon premier message. Je voudrais bien cette fois l'envoyer en pièce jointe pour que vous puissiez vérifier l'encodage des fichiers, mais apparemment ce n'est pas possible.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<style type="text/css">
p#pchessboard {font-family: 'chess alfonso-x'; font-size: 20px; color: black;}
p {font-family: courier new; font-size: 16px; color: black;}
</style>
</head>

<body>
<p id="pchessboard">
!""""""""#<br>
$tMvWlVmT%<br>
$OoOoOoOo%<br>
$ + + + +%<br>
$+ + + + %<br>
$ + + + +%<br>
$+ + + + %<br>
$pPpPpPpP%<br>
$RnBqKbNr%<br>
/(((((((()<br>
</p>
</body>
</html>


Essai avec ça Smiley murf
Modifié par Tintin75 (29 Feb 2016 - 19:13)
Tintin75 a écrit :
Essai avec ça Smiley murf


Merci mais malheureusement ça ne change rien. Smiley confused

Bon, ça n'est pas un besoin vital. Je crois que je ne vais pas vous embêter plus longtemps avec ça. J'ai quand même appris des choses dans cette discussion. Smiley smile
Modérateur
Bonjour,
Roland57 a écrit :
Voici les fichiers :

http://www.eschecs.fr/fichiers/temp/alfonso-iso-8859-1.html
http://www.eschecs.fr/fichiers/temp/alfonso-utf-8.html

Ces fichiers ne peuvent pas fonctionner dans le cas général, car la police 'chess alfonso-x' a toutes les chances de ne pas être installée sur la machine de l'utilisateur. Pour que ça fonctionne, tu dois :
1) copier la police CASEFONT.TTF sur ton site http://www.eschecs.fr/
2) en supposant que la police est dans le même dossier que tes fichiers HTML (si ce n'est pas le cas, il faudra rajouter un chemin relatif devant CASEFONT.TTF), ajouter au début de ton css (comme indiqué par JENCAL plus haut) :
@font-face {
    font-family: 'chess alfonso-x';
    src: url(CASEFONT.TTF);
}
Si ça marchait jusqu'à présent avec IE sur ta machine, c'est un coup de bol : tu as dû copier quelque part la police CASEFONT.TTF sur ton ordinateur et IE doit réussir à la trouver mais pas firefox (et ceci me surprend). Mais de toute façon, pour un internaute, il n'y a quasiment aucune chance qu'il ait cette police à disposition sur son ordinateur en local.

Amicalement,
Modifié par parsimonhi (29 Feb 2016 - 20:43)
Le chef à raison. Il faut installer la police, autrement ça fonctionnera pas. J'ai eu le cas aussi. C'est pas bien compliqué à faire, en plus.

Allez fait nous fonctionner ça Smiley biggrin
Merci pour vos suggestions. Je vais essayer. J'ai bien conscience que la police doit être installée sur ma machine et d'ailleurs elle l'est, comme d'autres polices du même genre que j'ai l'habitude d'utiliser. En l'occurrence je travaille sur un programme de jeu d'échecs dans lequel j'ai intégré une fonction qui produit du code HTML, afin de pouvoir vérifier le fonctionnement interne du programme. Je n'ai mis les fichiers sur mon site qu'afin que vous puissiez les télécharger. Smiley smile
Les polices en question sont accessibles à toutes mes applications (éditeurs de texte notamment) sans qu'il soit nécessaire de fournir le chemin.
Modifié par Roland57 (29 Feb 2016 - 21:24)
Pages :
Sujet clos
Aller à