Le liseré noir de Chrome

Bonjour à tous.

Sur le site http://corrigeur.fr je viens de constater une anomalie avec Chrome.
http://img15.hostingpics.net/pics/507360chrome.png
Lorsqu'on clique sur le bouton « En savoir plus », il apparait un liseré noir qui ne disparait plus.

À quoi cela est-il dû ? Comment corriger cela ?

Merci pour votre aide.
Modifié par Pyanepsion (22 Nov 2012 - 10:52)

Je ne comprends ce que tu as fait avec ton border de .borderway.

Ailleurs, sur les autres boutons orange, le liseré noir n'apparait pas quand on clique dessus depuis Google.

Voici le code que j'arrive à remonter.

<div class="bouton margin28">
    <a target="_blank" title="texte." href="pdf/rectifications-1990.pdf">
        <img width="100" height="94" title="Texte." alt="Texte" src="images/boutons/nouvelle-orthographe.png">
        <p class="borderway">En savoir plus…</p>
    </a>
</div>

body {
    color: #000000;
    font-family: Arial,Helvetica,FreeSans,sans-serif;
    font-size: 0.8em;
    line-height: 1.4;
    text-align: justify;
}
p {
    margin: 10px;
}
a {
    color: black;
}
.bouton {
    text-align: center;
}
.bouton {
    text-align: center;
}
.bouton img {
    margin:0;
}
.margin28 {
    margin: 28px;
}
.borderway {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #FEBD7F;
    border-color: #FFF4A4 #A67C53 #8C6846 #FFCC89;
    border-image: none;
    border-style: solid;
    border-width: 2px;
    font-size: smaller;
    text-align: center;
    width: 85px;
}
.borderway:hover {
    border-color:#f2ba87 #ffcc89 #fff4a4 #a67c53;
}
.borderway a{
    -moz-border-bottom-colors:none;
    -moz-border-image:none;
    -moz-border-left-colors:none;
    -moz-border-right-colors:none;
    -moz-border-top-colors:none;
    border:2px solid #ffdf96;
    border-bottom-color:#e2a871;
    border-left-color:#ffd992;
    border-right-color:#eaae75;
    color:black;
    display:block;
}

Modifié par Pyanepsion (23 Nov 2012 - 06:23)

Le code que tu donnes ne se comporte pas comme dans ton site.

Peut-être voir de ce côté

.borderway:visited {
    border-color:#f2ba87 #ffcc89 #fff4a4 #a67c53;
}

Par contre je comprends pas que tu aies: -moz-border-colors avec déjà des informations sur tes borders. Pourquoi préfixer border?

il doit y avoir une pseudo classe :visited quelques part dans ton CSS. Si j'efface le cache du navigateur la bordure disparait.

C'est ce que j'avais pensé au départ. Je ne vois cependant pas de visited. Je ne rencontre pas ce problème de liseré sous Internet Explorer ou Firefox.

Par contre en en créant une comme celle que je t'ai donné te permets de tester de ce côté.

Je pense qu'il s'agissait d'un conflit propre à Chrome. J'ai donc finalement préféré modifier le codage. Et maintenant, cela fonctionne. Merci à tous.

Ce n'était pas un problème avec :focus / :active plutôt ? Quand tu cliques tu ne survoles plus...