Select appearence not working properly in Firefox (29) and Internet Explorer (11)

Question

a question about a drop-down select, which looks not totally correct in its appearance, the default part on the right should not be visible with this code, but it is shown. this is the code, created inside a site developed with bootstrap for mobile template. do i miss something? do you need more information?

.menuSelect {
    -webkit-appearance: none;
    appearance: none;
    -moz-appearance: none;
    height: 75px;
    font-size: 30px;
    width: 100%;
    border: none;
    padding: 0 10px;
    background: url("img/selectmenu-arrowwhite.png") no-repeat scroll right center #00AEEF;
    color: #FFFFFF;
}

thanks in advance

Answer 1

A combination of low indent and text-overflow: '' works on FireFox. I did use it recently as well.

http://jsfiddle.net/Jg2nF/3/

.menuSelect {
    -webkit-appearance: none;
    appearance: none;
    -moz-appearance: none;
    height: 75px;
    font-size: 30px;
    width: 100%;
    border: none;
    padding: 0 10px;
    background: url("img/selectmenu-arrowwhite.png") no-repeat scroll right center #00AEEF;
    color: #FFFFFF;
}

I forgot IE, sorry. I'm using this currently:

http://jsfiddle.net/Jg2nF/4/

select::-ms-expand {
    display: none;
}