2012-08-17 4 views
1

J'utilise des icônes de police pour représenter Twitter, Facebook et rss sur un site que je construis et ils ont fière allure. Ils changent à leur couleur appropriée en vol stationnaire, lorsqu'ils sont actifs et sur la mise au point et fière allure sur Firefox et Opera.Hover dans Webkit montre la couleur d'origine sur les bords

Mon problème est avec Safari et Chrome sur Mac (donc je suppose que webkit). En vol stationnaire, vous pouvez voir juste un tout petit peu de blanc le long des bords d'une ou deux des icônes.

J'ai essayé de changer la couleur du lien/visité en vert et vous pouvez voir un peu de vert en vol stationnaire, donc je sais que c'est la couleur par défaut qui est vu.

Jetez un oeil sur les icônes sur la gauche du pied de page ici: http://tempertemper.net/index2

Voici quelques captures d'écran que j'ai pris:

enter image description here

L'oiseau Twitter ne semble pas grand dans le fond mais j'ai encore quelques ajustements à faire. Vous pouvez juste faire le blanc autour de son bec. Le logo facebook montre le haut et le bas et le symbole rss sur les bords gauche et inférieur.

Merci d'avoir regardé,

Martin.

+2

Je suis sur Win7 et Chrome dernière et je ne vois pas blanc. Si cela aide. Edit: http://exscale.se/__files/uploads/facebook-hover.png – powerbuoy

+1

Mais dans mac il y a un espace blanc – sandeep

+0

J'ai testé dans Chrome sur Win7 et Fedora. Je peux voir n'importe quoi. Pouvez-vous ajouter une capture d'écran? –

Répondre

0

Ajouter ce au style d'ancrage:

.social a:link, .social a:visited { 
    color: white; 
    border-bottom: none; 
    text-decoration: none; 
} 
+0

Cela n'a pas l'air de le réparer pour moi, vérifié dans l'inspecteur dans Chrome 21 Mac –

+0

Salut Vukasin. Merci mais ça ne semble pas le réparer. J'ai ajouté quelques captures d'écran pour que vous puissiez voir à quoi ça ressemble. – Martin

1

J'ai contacté le gars qui a fait la police et il a suggéré de changer l'ordre des @ demandes font-face afin que svg était au-dessus woff et TTF et il a fait ce meilleur. J'ai ensuite joué avec le dimensionnement de la police et réglé sur 4.15em, qui n'a montré aucun bord blanc dans Safari ou Chrome pour Mac. 4.1, 4.2, 4.3, 4.4, etc. ont tous présenté de légères lignes blanches.

Donc, c'est corrigé, mais je ne sais pas pourquoi!

Merci à tous pour avoir un regard et si quelqu'un d'entre vous savent peut-être pourquoi il se passait du tout, mais quelques tailles de police je serais intéressé de savoir :)

+0

Vous ne savez pas quel est le protocole ici: est-ce que je marque ma propre réponse comme correcte? Il est trié mais le problème réel peut encore exister pour certains utilisateurs de la police ... – Martin

4

Je rencontre le même problème avec Webkit sur Mac avec la police Univers.

Je l'ai résolu en réglant la moitié pixel dans mon attribut taille de la police: font-size: 18.5px

Questions connexes