web-dev-qa-db-fra.com

Supprimer le style complet d'un bouton HTML/submit

Est-il possible de supprimer complètement le style d'un bouton dans Internet Explorer? J'utilise un css Sprite pour mon bouton, et tout semble aller pour le mieux. 

Mais lorsque je clique sur le bouton, il se déplace légèrement vers le haut, ce qui le fait paraître déformé. Existe-t-il un état de clic css ou un mousedown? Je ne sais pas ce qui déclenche cet état.

Je sais que ce n'est pas vraiment grave, mais parfois, ce sont les petites choses qui importent.

htmlcssinternet-explorerbuttonstate
52
Saif Bechan

Je suppose que lorsque vous dites ' cliquez sur le bouton, il se déplace légèrement vers le haut ' vous parlez de l'état du clic de souris enfoncé pour le bouton, et que lorsque vous relâchez le clic de la souris, il retourne à son état normal? Et que vous désactivez le rendu par défaut du bouton en utilisant:

input, button, submit { border:none; }

Si c'est le cas..

Personnellement, j’ai constaté que vous ne pouvez pas réellement arrêter/annuler/désactiver cette action native IE, ce qui m’a amené à modifier un peu mon balisage pour permettre ce mouvement et ne pas affecter l’aspect général du bouton. les différents états.

Ceci est ma marge finale:

<span class="your-button-class">
    <span>
        <input type="Submit" value="View Person">
    </span>
</span>

50
a darren

Je pense que cela fournit une approche plus approfondie:

button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}
<button>Example</button>

52
Kevin Leary

Essayez de supprimer la bordure de votre bouton:

input, button, submit
{
  border:none;
}
7
Sarfraz

Votre question dit "Internet Explorer", mais pour ceux intéressés par les autres navigateurs, vous pouvez maintenant utiliser all: unset sur les boutons pour les déshabiller.

Cela ne fonctionne pas dans IE ni dans Edge 18, mais il est bien pris en charge partout ailleurs.

button {
  all: unset;
}
<button>check it out</button>

1
Dan Fabulich

Dans le bootstrap 4, c'est le plus simple. Vous pouvez utiliser les classes: bg-transparent et border-0

0
ValRob

Je pense que c'est le bouton "actif" état.

0
Midhat