Próbuję nadać stylu firewallowi w stylu <select>. W chromie Zrobiłem go z:Stylizacja wybranego elementu w przeglądarce Firefox
-webkit-appearance: none;
background: #eeeeee url("../img/select-arrow.jpg") no-repeat center right;
Ale firefox nie może wydaje się być w stanie uzyskać ten sam rezultat z
-moz-appearance: none;
background: #eeeeee url("../img/select-arrow.jpg") no-repeat center right;
Jakieś pomysły? Dzięki.
Ponieważ Firefox 35 "-moz-appearance:none", które już napisałem w kodzie, w końcu usunąć przycisk strzałki jako pożądane.
To był bug rozwiązany od tej wersji.
Wygląda na to, że Firefox ma błąd: -moz-appearance: none with select element. Zobacz ten raport o błędach, aby uzyskać więcej informacji: https://bugzilla.mozilla.org/show_bug.cgi?id=649849
EDIT [2]: Ponieważ @ João-Cunha awesome trick przestał działać w ff30, zobaczyć to nowe rozwiązania: http://jsfiddle.net/sstur/2EZ9f/ (na podstawie @ wyświetlaczu Kęska za: Flex Fix jakiś text-shadow magia)
EDIT: można to zrobić przy użyciu czystego CSS, jak wykazano tutaj: http://jsfiddle.net/sstur/fm5Jt/
To będzie projektować je w Chrome, Firefox, IE10 + i będzie wdzięcznie degradacji w starym IE i innych przeglądarek starszych. Korzysta z różnych obejść specyficznych dla dostawcy, w tym -webkit-appearance: none, jak wspomniano.
Tak, to jest: http://stackoverflow.com/a/18317228/1411163 –
Możesz spróbować użyć innej wartości dla właściwości -moz-appearance. Na przykład -moz-appearance: toolbox; działa dobrze dla mnie.
Pełna lista wartości można znaleźć tutaj: https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-appearance
dokładną kopią jak ten: https://stackoverflow.com/a/18317228/1411163
samą odpowiedź:
Tylko zorientowali się, jak usunąć wybierz strzałkę z Firefoksa. Sztuką jest użycie mieszanki -prefiksu-wyglądu, wcięcia tekstu i przepełnienia tekstu. Jest to czysty CSS i nie wymaga żadnych dodatkowych znaczników.
select {
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
}
Testowany na Windows 8, Ubuntu i Mac, najnowsze wersje Firefoksa.
żywo przykład: http://jsfiddle.net/joaocunha/RUEbp/1/
Więcej na ten temat: https://gist.github.com/joaocunha/6273016
Świetne znalezisko João!Zaktualizowałem mój JSFiddle, aby zaimplementować Twoją sztuczkę, a także Webkit i IE One, aby stworzyć naprawdę dobre rozwiązanie dla różnych przeglądarek w technologii CSS. – sstur
Dzięki! Potwierdzony jako błąd! –
Nie jestem pewien, czy to "błąd". Z '-moz-appearance: none' selekcja jest w zasadzie zaimplementowana przez komponentopodobny anonimowy DOM, którego strona po prostu nie potrafi. –
Nie mogę uwierzyć, że ten błąd nie został jeszcze naprawiony. – DesignerGuy