http://output.jsbin.com/titaki
When you open the above link in the firefix browser, you will find that there is a small container inside, and the drop-down button style is not friendly
Check it on Google
1.Small containers can use select:padding:0
2. The drop-down icon can use background-image; -moz-appearance:none to remove the style of the drop-down box, and then
@-moz-document url-prefix() {
select.form-control {
-moz-appearance: none;
appearance: none;
background-image: url("../image/buy-other-down .png");
background-repeat: no-repeat;
background-position: calc(100% - 7px) 50%;
background-size: 15% auto;
border-radius:3px;
padding:0;
}
}
ps: The small container can be removed with padding: 0, but in this case there will be no padding-left in select, and the interface is not friendly. I don’t know how to solve the problem of this small container, and I still need to explore. Garden friends are welcome to give suggestions.