With the big new update from Woocommerce last week came several minor (and major) bugs, and some of them are quick and easy to fix.
One issue we’ve seen noted on several support forums and also experienced it on some websites that we manage is the duplication of what is called the “spin buttons”. Google Chrome and other HTML5 friendly browsers automatically add plus and minus buttons to the number input field, and because Woocommerce also adds these buttons to number fields, the user sees an unnecessary duplication. Small things like this can hurt even the most beautiful website designs.
So, until Woocommerce includes this in an update, we can easily fix this with a nice snippet of CSS. Our lead front-end guy (and founder!) Brian wrote the following fix for the spin button duplication issue on Woocommerce number fields:
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
