SORU
6 Mayıs 2011, Cuma


Bir ok kaldırmak için nasıl <select> Firefox etiketi

Hey, <select> etiket CSS3 (ben, form elemanları için özel stiller genel olarak kötü bir fikir olduğunu biliyorum) kullanarak stil için çalışıyorum. Y (Chrome / Safari) ben arzu sonuç alıyorum, ama Firefox güzel (hatta IE ile rahatsız etmiyorum) oynamıyor. CSS3 appearance özelliği kullanıyorum, ama nedense Firefox dışarı açılan simgesini kurtulamıyorum.

Burada ne yaptığımı bir örnek: http://jsbin.com/aniyu4/2/edit

#dropdown {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px 30px 2px 2px;
    border: none;
    background: transparent url("http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png")
        no-repeat right center;
}

Gördüğünüz gibi, bir şey fantezi için çalışmıyorum. Ben sadece varsayılan stilleri kaldırmak ve kendi açılan okum eklemek istiyorum. Gibi, büyük Y, Firefox harika dedim. Görünüşe göre, -moz-appearance: none doens't açılan maddeyi kurtulmak.

Herhangi bir fikir? Ve, hayır, javascript bir seçenek değil. Bir şey çok saçma javascript yürütmek istemiyorum.

CEVAP
19 AĞUSTOS 2013, PAZARTESİ


Güncelleme:bu Firefox v35 giderilmiştir. Ayrıntılar için full gist bkz.


Sadece anladımnasıl Firefox seç Kaldır. Hile -prefix-appearance, text-indent text-overflow bir karışımı kullanmaktır. Saf CSS ve ekstra biçimlendirme gerektirir.

select {
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
}

Windows 8, Ubuntu üzerinde test edilmiş ve en son Firefox sürümleri Mac.

Canlı örnek: http://jsfiddle.net/joaocunha/RUEbp/1/

Bu konuda daha fazla: https://gist.github.com/joaocunha/6273016

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Elliot Davin

    Elliot Davin

    28 Kasım 2008
  • Photoshop Tutorials

    Photoshop Tu

    22 HAZİRAN 2011
  • TheDailyTechDose

    TheDailyTech

    15 EKİM 2012