Problème décoration sur balise <summary> lors du clique

YameFAZE Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   -  
Zepines Messages postés 76 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Je possède des balises <details> accompagnées de balises <summary> et j'ai remarqué que sous certains navigateurs, lorsque l'on clique sur "Détails" pour afficher le texte masqué, un cadre bleu apparaît comme pour des liens. J'ai essayé différentes méthodes dont une qui semble fonctionner sur la plupart des navigateurs mais qui n'est toujours pas acceptée par Google Chrome.

/* Textes complémentaires */
summary,
summary:link,
summary:visited,
summary:hover,
summary:active {
	text-decoration: none;
	outline: 0;
	border: none;
	outline-style: none;
}


Merci d'avance.

Configuration: Ordinateur portable ASUS UX21E
Windows 7

1 réponse

Zepines Messages postés 76 Date d'inscription   Statut Membre Dernière intervention   227
 
Bonsoir @YameFAZE,

Ce cadre bleu apparaît lorsqu'un élément à le focus. Pour modifier l'apparence d'un élément HTML lors du focus tu dois utiliser la pseudo-classe
:focus
.

Par exemple :

details:focus {
 outline: 0;
}


Bonne soirée, Zepines.

0
Zepines Messages postés 76 Date d'inscription   Statut Membre Dernière intervention   227
 
Petite erreur dans mon code, il faut remplacer
details
par
summary
.
0