Eliminar el estilo completo de un botón HTML/enviar
¿Existe alguna forma de eliminar por completo el estilo de un botón en Internet Explorer? Utilizo un objeto CSS para mi botón y todo se ve bien.
Pero cuando hago clic en el botón, se mueve un poco hacia arriba, lo que hace que parezca fuera de forma. ¿Hay un estado de clic CSS o mousedown? No sé qué desencadena ese estado.
Sé que no es gran cosa, pero a veces son las pequeñas cosas las que importan.
Creo que esto proporciona un enfoque más 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>
Su pregunta dice "Internet Explorer", pero para aquellos interesados en otros navegadores, ahora pueden usar all: unset
los botones para quitarles el estilo.
No funciona en IE, pero es compatible con todos los demás.
https://caniuse.com/css-all
Advertencia de accesibilidad: por el bien de los usuarios que no utilizan el puntero del mouse, asegúrese de volver a agregar algo :focus
de estilo, por ejemplo, button:focus { outline: orange auto 5px }
para accesibilidad del teclado . Si te da pereza, puedes button:focus { outline: revert }
revertir el esquema al valor predeterminado del navegador. https://caniuse.com/css-revert-value
(Y espero que esto sea evidente, pero asegúrese de agregar algún tipo de estilo para que su botón realmente parezca un botón, y preferiblemente algo :hover
de estilo también. Si su botón no tiene un borde, considere cursor: pointer
también. )
button {
all: unset;
}
button:focus {
outline: revert;
}
<button>check it out</button>