J'ai un bouton d'amorçage personnalisé et je ne peux pas supprimer sa bordure après avoir cliqué. J'ai pu changer sa couleur de fond mais il y a une bordure bleue insistante qui m'ennuie.

Je clique dessus, il ouvre une fenêtre modale et après avoir fermé le modal la bordure est toujours là jusqu'à ce que je clique sur une autre partie de la page même si je change des valeurs dans :active et :focus.

enter image description here

html :

<button id="openPopup" type="button" class="btn btn-primary btn-lg text-uppercase" data-toggle="modal" data-target="#myModal">
    some text here
</button>

css :

#openPopup {
  padding: 20px 30px;
  background-color: #a2238e;
  border-color: #a2238e;
  box-shadow: 1px 1px 1px #999;
  white-space: normal;
  font-size: smaller;
  letter-spacing: 0.2px;
}

#openPopup:hover, #openPopup:active, #openPopup:focus {
  background-color: #912284 !important;
  border-color: #912284 !important;
}
1
madsongr 15 avril 2018 à 00:06

3 réponses

Meilleure réponse

Essaye ça

#openPopup:focus {
    outline: none;
}

Ou

#openPopup:focus {
    outline: 0;
}
0
Troyan Victor 14 avril 2018 à 21:20

Essaye ça

#openPopup { outline:none; border-style: none; }

#openPopup:hover, #openPopup:active, #openPopup:focus { outline: none; border-style: none; }
0
Sir Kane 14 avril 2018 à 21:19

Essayez de supprimer la bordure sur: focus et: actif

#openPopup:active, #openPopup:focus { 
   border-style: none !important;
}
-1
ritesh.p 14 avril 2018 à 21:28