Bonjour

Depuis quelques jours, je développe un petit site web pour une entreprise. J'utilise principalement Chrome, mais le site est compatible FF, Opéra et IE8+, tout passe niquel sur les versions des navigateurs Windows et Linux.

Aujourd'hui j'ai reçu mon Macbook et je décide de reprendre le dév depuis ma nouvelle machine, mais là, j'ai un rendu qui est différent. Sur Chrome et Safari, beaucoup de texte ne s'affiche pas (reste en blanc mais est sélectionnable) et sur FF, quelques problèmes de texte à la mauvaise place.

J'utilise un font-face avec une police propriétaire à la boite, mais j'ai mis Helvetica et Arial également dans les polices principales. La couleur par défaut est bien le noir, enfin bref, je pense n'avoir rien oublié, j'espère...

Ca vous est déjà arrivé ce genre de soucis ? J'ai vraiment aucune idée de comment faire pour résoudre ce problème

Attend, je sors ma boule de cristal pour voir ton code !

Il y a des milliers de lignes et je ne sais pas d'où vient le problème surtout qu'il est spécifique à Chrome et Safari sur OS X, donc je vais pas foutre tout le projet

Je viens juste demander, au cas où le problème serait connus par les utilisateurs de Mac

Salut,

On peut avoir le lien du site ?

Le site n'est pas encore hébergé mais voilà 2 exemples (J'ai viré les photos, confidentiel pour l'instant)

Dans la zone tout en haut, à côté du retour à l'accueil, il y a toujours un titre en grand et tous les blocs au fond coloré contiennent des paragraphes.
Ce sont des screens venant de Chrome, sur FF ces parties s'affichent comme il faut.

J'ai remarqué que ça le faisait surtout dans les blocs de texte où je fais un retour de ligne avec des <br />, mais pas toujours.

Il faut utiliser "-webkit-". Je ne sais plus comment ça s'appelle.

Sur les propriétés CSS comme par exemple -webkit-box-shadow ? Mais sur quelles propriétés, font-family, color,... ?

Non, aucun rapport (et à ce sujet : http://www.emmanuelbeziat.com/blog/prefixes-css-jusqua-quand/)

Commence par valider ton html, si ce n'est déjà fait : http://validator.w3.org/ Une base saine, c'est un prérequis.

Le code HTML est déjà entièrement valide W3C

Ok ; alors y a pas d'autres possibilité que de voir le code, d'une façon ou d'une autre...

Quelles parties du code tu veux exactement ?

Et je viens de remarquer, ce ne sont pas les couleurs de police qui passent en blanc car certains textes (dans les cadres marrons et bleus) sont en blancs de base.

J'ai testé sur Safari sur iPad, pas de problèmes non plus...
Ce midi j'essaierai de voir si c'est pas un souci de z-index. C'est bizarre car j'arrive quand même à sélectionner le texte, le copier et le coller

Ce n'est pas le z-index non plus.
Par contre, je viens de désactiver le font-family et les textes réapparaissent

Cela pourrait venir du fichier de la font ? Le format ? (C'est un .ttf)

Il faut plusieurs formats pour être compatible avec une font-face. Regarde le générateur de font-squirrel, ça te fournira un code un peu comme ça : http://www.emmanuelbeziat.com/blog/utiliser-les-proprietes-de-police-avec-une-font-web/

Le format ttf ne fonctionne pas sur mac pour l'inclusion web, si je me rappelle bien.

Globalement, en terme de support, si tu inclus les typos en .eot et .woff, tu couvres tous les navigateurs modernes.

Je viens de trouver une solution à mon problème qui vient bien de la font.

L'attribut font qui posait le problème :
font-family:"Custom Font",Helvetica,Arial;

La solution :
font-family:"Custom Font",Helvetica,Arial,;

Le fait de rajouter la virgule tout à la fin réaffiche tout le texte de la page, j'ai trouvé ca vraiment par hasard en éditant l'attribut dans la console. Vous avez une explication rationnelle à la cause du bug ?

Fausse joie, cette solution fonctionne sous OS X mais pas sur Windows

lisarael Le format ttf est bien supporté sur Mac, vu sur la FAQ de dafont Par contre j'ai pas la font en eot et woff donc je suis baisé

warpShadow Merci pour le lien, je vais regarder ça de tout suite

Triple post, mais ta solution à fonctionnée warpShadow, ça résout tous les problèmes sur Chrome, Safari et FF sur OS X !

Mille merci, je garde ce site bien au chaud dans mes favoris