IE & Firefox - custom drop down could not remove native arrows

Question

I\'m trying create a custom drop down control and I need to hide the arrows from the native controls. I\'m using the following CSS, which is working for Chrome

Answer 1

For Fx I use -moz-appearance: checkbox-container which works nicely.

So putting it all together the following should be sufficient for you:

select.desktopDropDown {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: checkbox-container;
    border-style: none;
}
select.desktopDropDown::-ms-expand {
    display: none;
}