J'ai un bouton stylé sur mon site web. Mais lorsque je clique dessus, cela crée une bordure ou un contour indésirable (je ne sais pas lequel). Comment puis-je supprimer cette frontière? Vous trouverez ci-dessous tout le code associé au bouton.
button {
border: hidden;
cursor: pointer;
outline: none;
}
<button>this is my button</button>
Si vous parlez de la ligne pointillée dans Firefox, je pense que ce que vous recherchez est la suivante:
button::-moz-focus-inner { border: 0; }
Ceci est un fil de discussion sur le sujet: Comment supprimer le contour en pointillé de Firefox sur les BOUTONS ainsi que les liens?
Utilisez l'un de ces styles CSS
a:active, a:focus,input, input:active, input:focus{ outline: 0; outline-style:none; outline-width:0; }
a:active, a:focus,button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner
{ border: none; }
OR
:focus {outline:none;} ::-moz-focus-inner {border:0;}
Une fois la partie de style CSS terminée, vous devrez peut-être également définir IE-Emulator. Mettez à jour le fichier web.config de vos applications Web et incluez la clé ci-dessous.
<system.webServer>
<httpProtocol>
<customHeaders>
<clear />
<add name="X-UA-Compatible" value="IE=7; IE=9; IE=8; IE=5;" />
</customHeaders>
</httpProtocol>
</system.webServer>
outline: none;
Cela a fonctionné pour moi dans Chrome.
C'est un contour. Utilisez outline:none;
sur: focus pseudo-class pour le supprimer. A bien fonctionné pour moi.
Veuillez ne pas supprimer les contours sur les styles de focus, cela rend votre site moins accessible aux utilisateurs utilisant uniquement le clavier et les utilisateurs malvoyants.
Si vous choisissez d'ajouter quelque chose comme :focus { outline: none; }
à vos feuilles de style, ajoutez également vos styles pour les éléments ciblés.
Reading: Ne jamais supprimer les contours CSS