Im tratando de diseñar un <select> en firefox. En cromo lo hice con:Diseñar un elemento selecto en Firefox
-webkit-appearance: none;
background: #eeeeee url("../img/select-arrow.jpg") no-repeat center right;
Pero en Firefox me parece que no puede ser capaz de obtener el mismo resultado con
-moz-appearance: none;
background: #eeeeee url("../img/select-arrow.jpg") no-repeat center right;
¿Alguna idea? Gracias.
Desde Firefox 35, "-moz-appearance:none" que ya ha escrito en su código, por último botón de flecha quitar si lo deseas.
Fue un bug resuelto desde esa versión.
Parece que esto es un error en Firefox: -moz-apariencia: ninguno con elemento seleccionado. Ver este informe de error para obtener más información: https://bugzilla.mozilla.org/show_bug.cgi?id=649849
EDITAR [2]: Puesto de @ João-Cunha awesome trick dejó de funcionar en FF30, ver esta nueva solución: http://jsfiddle.net/sstur/2EZ9f/ (basado en @ pantalla de Keska: solución flexión y algo de texto-sombra magia)
EDIT: Esto se puede hacer usando CSS puro, como se ha demostrado aquí: http://jsfiddle.net/sstur/fm5Jt/
Esto lo estilo en Chrome, Firefox, IE10 + y con gracia degradarse en edad IE y otros navegadores antiguos. Utiliza varias soluciones específicas del proveedor, incluido -webkit-appearance: none, como mencionó.
Sí, es: http://stackoverflow.com/a/18317228/1411163 –
Puede intentar utilizar un valor diferente para la propiedad -moz-appearance. Por ejemplo, -moz-appearance: toolbox; me funciona bien.
Lista completa de los valores se puede encontrar aquí: https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-appearance
duplicado exacto como éste: https://stackoverflow.com/a/18317228/1411163
La misma respuesta:
acabo de descubrir cómo quitar la flecha de selección de Firefox. El truco es usar una mezcla de -prefijo-apariencia, texto-sangría y desbordamiento de texto. Es puro CSS y no requiere marcado adicional.
select {
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
}
Probado en Windows 8, Ubuntu y Mac, las últimas versiones de Firefox.
ejemplo vivo: http://jsfiddle.net/joaocunha/RUEbp/1/
Más sobre el tema: https://gist.github.com/joaocunha/6273016
¡Gran hallazgo João!He actualizado mi JSFiddle para implementar tu truco, así como el Webkit y el IE para formar una solución de navegador cruzada de Pure CSS realmente agradable. – sstur
Gracias! ¡Confirmado como un error! –
No estoy seguro de que sea un 'error'. Con '-moz-appearance: none' una selección se implementa básicamente a través de un DOM anónimo como componente, que la página simplemente no puede diseñar. –
No puedo creer que este error no haya sido resuelto todavía. – DesignerGuy