Desabotonar botones

No hacemos mucho profundizamos en la anulación de estilos de botones predeterminados aquí en . Con una variedad de estilos totalmente compatibles con todos los navegadores, está buscando entre 6 y 10 reglas CSS para eliminar todo lo que necesita para desactivar un botón y luego implementar sus propios estilos. No es gran cosa si me preguntas, especialmente porque es muy probable que diseñes botones de todos los modos.

Scott O’Hara ha echado un vistazo y también incluye un par de otras exploraciones CSS interesantes, ninguna de las cuales se acumuló por diferentes razones:

• display: contents;– algunos problemas de accesibilidad basados ​​en la semántica.
• all: unset;– no restablece el valor de visualización, no es lo suficientemente compatible con el navegador.

Me tomó un poco de tiempo entender esto, incluso tener una pequeña charla con Scott a través de mensajes directos. Estaba tan confundido que la forma correcta de hacer lo que él estaba planteando era span role="button" tabindex="0"… ¡¿Qué?! Pensé. Casi nunca es lo correcto forzar a un elemento que no es un botón a comportarse como un botón y tener que replicar toda la funcionalidad del botón de otras maneras. Y, de hecho, si solo tiene un botón de una o dos palabras, probablemente no lo necesite y simplemente pueda deshacer los estilos de los botones. El problema viene aquí: no puedes deshacer inline-blockun archivo button. Aparentemente es simplemente imposible. Puedes configurarlo display: inline;y lo aceptará, pero no se comportará así.