Rimuovi lo stile completo di un pulsante / invio HTML

Esiste un modo per rimuovere completamente lo stile di un pulsante in Internet Explorer? Uso uno sprite CSS per il mio pulsante e tutto sembra a posto.

Ma quando faccio clic sul pulsante, si sposta un po 'in alto, lo fa sembrare fuori forma. Esiste uno stato di clic CSS o un mousedown? Non so cosa fa scattare quello stato.

So che non è un grosso problema, ma a volte sono le piccole cose che contano.

Presumo che quando dici " fai clic sul pulsante, si sposta un po 'in alto ", stai parlando dello stato del clic del mouse verso il basso per il pulsante e che quando rilasci il clic del mouse, ritorna al suo stato normale ? E che stai disabilitando il rendering predefinito del pulsante utilizzando:

input, button, submit { border:none; } 

Se è così..

Personalmente, ho scoperto che non puoi effettivamente interrompere / sovrascrivere / disabilitare questa azione nativa di IE, il che mi ha portato a modificare un po 'il mio markup per consentire questo movimento e non influenzare l'aspetto generale del pulsante per i vari stati.

Questo è il mio punteggio finale:

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

Penso che questo fornisca un approccio più completo:

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

<button>Example</button>

La tua domanda dice "Internet Explorer", ma per chi è interessato ad altri browser, ora puoi utilizzare i all: unsetpulsanti per rimuovere lo stile.

Non funziona in IE o Edge 18, ma è ben supportato ovunque.

https://caniuse.com/#feat=css-all

Avviso colore Safari: l' impostazione del testo colordel pulsante dopo l'utilizzo all: unsetpuò non riuscire in Safari 13.1, a causa di un bug in WebKit . (Il bug verrà corretto in Safari 14 e versioni successive.) " all: unsetÈ impostato -webkit-text-fill-colorsul nero e questo ha la precedenza sul colore." Se è necessario impostare il testo colordopo l'uso all: unset, assicurarsi di impostare sia il colorche il -webkit-text-fill-colorsullo stesso colore.

Avviso di accessibilità: per il bene degli utenti che non utilizzano un puntatore del mouse, assicurati di aggiungere nuovamente uno :focusstile, ad esempio button:focus { outline: orange auto 5px }per l' accessibilità da tastiera .

E non dimenticare cursor: pointer. all: unsetrimuove tutti gli stili, incluso il cursor: pointer, che fa sembrare il cursore del mouse una mano che punta quando si passa con il mouse sul pulsante. Quasi sicuramente vorrai riportarlo indietro.

button {
  all: unset;
  color: blue;
  -webkit-text-fill-color: blue;
  cursor: pointer;
}

button:focus {
  outline: orange 5px auto;
}

<button>check it out</button>

Prova a rimuovere il bordo dal tuo pulsante:

input, button, submit
{
  border:none;
}

In bootstrap 4 è più semplice. Puoi usare le classi: bg-transparenteborder-0

Penso che sia lo stato "attivo" del pulsante.