28172 sujets

CSS et mise en forme, CSS3

Bonsoir,

On vient de m'envoyer une capture d'écran de mon site (http://jul11.idoo.com) sur la version 3.0.4 de Safari... Il affiche une typo complètement délirante, avec du texte énorme et en majuscules sous les titres (qui eux s'affichent correctement, tout comme le texte de la barre horizontale de navigation).
Ci-joint la dite capture.
Vois pas du tout l'origine du problème, vu que je n'ai pas du tout défini ce style de caractères au niveau du css (pour info Gill sans, sans-serif). Je pensais à un pb d'encodage de mes feuilles de style, où j'ai tour-à-tour enlevé et remis le charset UTF-8, mais ça n'a rien changé...
Quelqu'un pour m'éclairer sur ce mystère ?

Merci

upload/16650-image.gif
Modifié par Jul11 (13 May 2008 - 22:43)
Bonsoir Jul11,

Je ne suis pa sûr que les polices que tu renseignes dans tes css soient présentent sur toutes les machines de tes visiteurs
a écrit :
"Myriad Pro Bold It","Gill Sans",...

Elles ne sont pas installées chez moi par exemple, donc il est fort probable que tu aies des différences d'affichage notables suivant la présence ou non des "polices spécifiques" que tu choisis Smiley cligne

Un lien interessant et forcément

Cdt,
Sylvain
Merci Sylvain

Ce qui m'échappe c'est que j'ai spécifié dans tous mes css qu'en l'absence des premières typos demandées il fallait du sans-serif... Or c'est un drôle de sans-serif qui s'affiche là !
Et je comprends encore moins pourquoi le sans-serif appelé sur les titres s'affiche proprement alors que ça merdouille sur le texte.
Bon je vais déjà essayer en appelant un arial tout bête avant le sans-serif...

Cordialement
Jul.
Modifié par Jul11 (13 May 2008 - 23:24)
Et je rajoute:
- Typographie web : gérer la taille du texte avec les « em »;
- Familles de fontes «standard» pour le web.

Jul11 a écrit :
Ce qui m'échappe c'est que j'ai spécifié dans tous mes css qu'en l'absence des premières typos demandées il fallait du sans-serif... Or c'est un drôle de sans-serif qui s'affiche là !

C'est possible si l'utilisateur a choisi cette fonte étrange comme fonte sans-serif par défaut pour son navigateur ou son système d'exploitation.

Jul11 a écrit :
Bon je vais déjà essayer en appelant un arial tout bête avant le sans-serif...

Ça c'est une idée qu'elle est bonne. Smiley smile

(On peut aussi décider d'ignorer un problème soulevé par un utilisateur et dépendant très fortement de sa configuration à lui qu'il l'a bidouillée tout bizarrement, le cas échéant. Smiley cligne )
Modifié par Florent V. (13 May 2008 - 23:24)
Je comprends bien l'intérêt de gérer la taille du texte en em et non en pixels. J'y penserai pour mon prochain site, mais j'avoue que pour celui-ci je me vois pas trop tout rédéfinir...
A moins que le pb que je rencontre avec cette version de Safari soit directement lié à la gestion en px plutôt qu'en em !
En tous cas merci
Modifié par Jul11 (13 May 2008 - 23:40)
Là je comprends vraiment rien... Smiley bawling
Mon pote qui surfe avec Safari 3.0.4 me dit qu'il n'y a aucun changement depuis que j'ai mis l'arial avant le sans-serif !
Le pire c'est que dans les pages du site, avec des polices identiques partout au niveau du css, certain des textes s'affichent correctement et d'autres avec cette fonte à la C#N !
Et il me dit qu'il n'a pas du tout bidouillé les fontes par défaut du navigateur...
Ca sent le nervous breakdown Smiley biggol
Jul11 a écrit :
Mon pote qui surfe avec Safari 3.0.4 me dit qu'il n'y a aucun changement depuis que j'ai mis l'arial avant le sans-serif !

Le pote en question sait comment on vide le cache de son navigateur?

Sinon, une liste rapide de tes familles de fontes:
font-family: "Myriad Pro Bold It", "Gill Sans", Arial, sans-serif;
font-family: "Myriad pro", Arial, sans-serif;
font-family: "Gill Sans", Arial, sans-serif;

Il se peut que "Myriad Pro Bold It", "Myriad pro" ou "Gill Sans" soient non installées sur le système du testeur et soient mappées automatiquement vers une autre police qui n'a rien à voir. C'est un risque à priori limité car il est probable que le testeur ait installé lui-même cette fonte fantaisie, et donc que la plupart ou la quasi-totalité des utilisateurs d'OS X n'aient pas ce problème.

À toi de repérer laquelle de ces chaines de caractères ("Myriad Pro Bold It", "Myriad pro", "Gill Sans") est mal mappée, quelle est la fonte qui est utilisée sur le poste du testeur, et tu verras s'il y a une proximité qui peut expliquer cette erreur de correspondance. Si c'est le cas, tu décideras si tu dois modifier tes familles de polices ou si tu estimes que le risque est minime.
Merci beaucoup Florent,

Je n'avais jamais entendu parler de mappage (mapping?). J'examinerai tout ça quand j'aurai réussi à me dépatouiller d'un problème qui préoccupe beaucoup plus en fait... J'en parle sur ce même forum :

http://forum.alsacreations.com/topic-4-34707-1-Safari-et-Internet-explorer-meme-combat-.html

Depuis mon dernier post j'ai revu mon css de manière à limiter les positionnements relatifs... Mais Safari 2 ne veut toujours pas me rendre le bloc qui manque.
T'aurais pas une idée ?
Merci d'avance !