Va un truquillo rápido. Los que ya habéis saltado a Internet Explorer 10 seguro habréis notado el pequeño botón que este navegador añade a los cuadros de edición estándar cuando obtienen el foco, y que permite limpiar rápidamente su contenido:
Pues bien, hay veces que a nivel de diseño no nos interesa que se muestre la pequeña “X” en los controles, su posición entra en conflicto con otro elemento visual, o simplemente no queremos aportar esta funcionalidad, por lo que es posible desactivar esta característica de los <input>
usando CSS:
1
2
3
|
input::-ms-clear{ display : none ; } |
Tan sencillo como eso.
Pero seguro que te estás preguntando, ¿y en vez de eliminarla puedo personalizarla? Pues un poco también 😉 Observad el siguiente código:
1
2
3
4
5
|
input::-ms-clear{ background-color : red ; color : white ; border : 1px solid #808080 ; } |
En tiempo de ejecución, esa discreta e insípida “X” se habría convertido en algo bastante más contundente 😉
Publicado en: Variable not found.