18041 sujets

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

Souci de font uniquement sur Firefox

Bonjour Smiley smile

Je développe en ce moment mon site personnel et je me retrouve ce soir face à un problème qui me laisse tout à fait pantois.
Je vous laisse constater.

Sous Firefox :
http://www.inikisha.net/tips/firefox.png

Sous Safari (le rendu attendu) :
http://www.inikisha.net/tips/safari.png

Il y a un tout un tas de petites différences comme celles-ci présentes uniquement sur Firefox, vous pouvez cliquer ici pour voir le site. Je n'ai pas la possibilité de tester sur Internet Explorer mais ça passe bien dessus m'a-t-on dit.
Je ne comprend absolument pas, d'autant que c'est arrivé "d'un coup". J'ai forcément changé quelque chose, ça ne bugue pas d'une seconde à l'autre sans raison mais je n'arrive pas à trouver quoi. J'ai essayé de vider mon cache, de redémarrer dans un geste désespéré... Rien n'y fait, et je n'explique toujours pas cette différence soudaine.

J'ai fais quelques recherches mais je n'ai rien trouvé et je ne sais de toute façon pas quoi chercher.

Donc voilà, si vous avez une idée de ce qui peut bien se passer, je suis preneur. Évidemment, si vous avez des remarques à faire au passage sur le site (même si bon il n'y a pas grand-chose à voir), ne vous privez pas.

Merci ! Smiley smile

(je ne suis pas sûr d'avoir posté au bon endroit, j'ai hésite avec "CSS et mise en forme")
Modifié par Inikisha (24 Sep 2010 - 00:30)
Bonjour Smiley smile

Non, pas de zoom. J'ai également testé sur Firefox 3.6.10 mais les erreurs persistent. Je vous met des captures d'écran des étranges différences.

Sous Safari :
http://www.inikisha.net/tips/safari1.png
Sous Firefox :
http://www.inikisha.net/tips/firefox1.png
Le texte est plus petit et il y a un écart à gauche de Inikisha.

Sous Safari :
http://www.inikisha.net/tips/safari2.png
Sous Firefox :
http://www.inikisha.net/tips/firefox2.png
Cette fois-ci le texte est de la même taille mais le lien est en capitales et en Arial. ^^"

Sous Safari :
http://www.inikisha.net/tips/safari3.png
Sous Firefox :
http://www.inikisha.net/tips/firefox3.png
Ca ne se voit pas très bien mais il y a un très léger écart entre le cadre vert foncé et le haut de la page.

J'avais constaté comme une différence de letter-spacing hier soir dans le footer et ce matin... Plus rien !
foued tu es certain qu'il n'y a aucune différence ? Le site est tout à fait lisible et présentable, il y a juste quelques petites différences que je ne m'explique pas, et qui ne s'expliquent pas par la différence de navigateur.

De plus il y a un petit écart entre les liens du menu (vous pouvez le voir en passant votre souris sur "News" en allant sur cette page) mais ça je le constate sur tous les navigateurs. Comment puis-je le supprimer ? J'ai essayé de mettre des margin: 0; mais ça ne fonctionne pas.
Autre question de base : tu a vidé ton cache ?

Rassure-toi, je ne te prend pas pour un idiot, mais je n'ai pas FF sous la main et dans les symptômes décrits il n'y a rien qui indique un problème d'interprétation des CSS ; mais plutôt un problème local (zoom, cache, configuration personnelle...).
Bonjour,

Je suis peut-être à côté de la plaque mais est-ce que ce ne serait pas une question de taille minimale de la police dans les options du navigateur ?
Bonjour Smiley smile

@Laurie-Anne : oui, je l'avais précisé dans mon post initial et je l'ai refais à l'instant mais ça ne change rien.

@thelma : je ne pense pas car seul le texte du menu est affecté et le lien que j'ai mis en capture d'écran n'est pas plus gros, il est carrément passé en lettres majuscules.

Les différences n'apparaissent que chez moi ou vous pouvez les constater aussi ? Je précise que je n'ai pu avoir de retours que de gens sur Mac, à part une personne qui était sur PC mais avec Internet Explorer. Je ne sais pas ce que donne Firefox sur PC, peut-être que le problème ne survient que sur les Macs.
Déjà je peux te dire que sous Linux avec Iceweasel (version debian de firefox) et Konqueror, il n'y a pas de soucis. J'ai regardé sous Windows avec IE8, FF3.6.10 et Chrome et je ne vois pas de problème de majuscule. Les polices 'book' ont l'air ok aussi.
Je n'ai pas de Mac... Smiley rolleyes
Modifié par thelma (24 Sep 2010 - 16:00)
Bon alors le problème semble venir de Firefox sous Mac. J'ai demandé autour de moi et sous Windows pas de souci que ce soit avec Internet Explorer ou avec Firefox, d'après thelma pas de souci sous Linux...

Le truc bizarre c'est que je constate le même problème avec l'erreur 2 sous Firefox Windows, mais je semble être le seul.
Et le truc VRAIMENT bizarre, c'est qu'une amie sous Firefox Mac a constaté la même chose que moi : tout va bien, mais dès qu'elle a eu cliqué sur un lien du menu, patatra... Les bugs arrivent.

Je résume :
*** Mac
--- Firefox : bugs apparaissent dès qu'on clique sur un lien
--- Safari : RAS
*** PC
--- Firefox : RAS
--- Internet Explorer : RAS sauf chez moi où il y a 1 bug
--- Chrome : RAS
*** Linux
--- Iceweasel : RAS
--- Konqueror : RAS

WTF ? ^^"
Je vais tester avec un maximum d'autres navigateurs sous PC et Mac mais je ne comprend absolument rien.

Edit: je viens d'appeler un ami sous Leopard qui a testé avec Firefox 3.6.10 et il n'a aucun problème d'affichage. ^^"
Je n'ai absolument pas touché mon code depuis hier soir et de nouveaux bugs surviennent : sur la page de contact, le lien vers le blog qui était auparavant comme il était censé l'être ressemble à ça maintenant :
http://www.inikisha.net/tips/firefox2.png
Heeeeelp, ça change tout seul. Smiley bawling
Modifié par Inikisha (24 Sep 2010 - 17:02)
Ca y est, j'ai le même problème que toi après avoir navigué un peu sur le site - avec Iceweasel. Et j'ai pu le reproduire sous FF 3.6.10 et IE8 sous windows... Très étrange en effet. Par contre, je n'ai pas de piste... Il faut voir ton code.

Il y a peut-être un truc dans ton contact.php et la div n'est pas fermée
<p><a href="contact.php">Vous me parlez du vôtre ?</a></p>
</div <!-- Fin de #social. -->
Modifié par thelma (24 Sep 2010 - 17:08)
J'ai trouvé !

J'avais écris ceci pour plusieurs div :

#blog a, a:visited {
    color: #AAAAAA;
    text-decoration: none;
    text-transform: uppercase;
}

En pensant qu'il n'y avait pas besoin de préciser à nouveau le div pour le a:visited. Du coup, le style s'appliquait à TOUS les liens du style une fois qu'ils avaient été cliqués...

Ceci explique les différences incompréhensibles en fonction de l'OS et du navigateur, il fallait cliquer sur les liens. Smiley smile

Donc voilà, tout ça pour une étourderie... Merci de votre aide. Smiley smile
Sujet clos
Aller à