Number Input - Always Show Spin Buttons

In Google Chrome, input[type=number] spin buttons are shown only on hover. This is the code I use: Is there any way to always show spin buttons?

Solution 1:

You can target spin buttons using ::-webkit-inner/outer-spin-button and than just set opacity to 1 (spins are always there, but in default they have opacity: 0).

Code:

<style>  

input[type=number]::-webkit-inner-spin-button {
    opacity: 1
}

</style>
<input type="number" value="1" min="1" max="999">

Fiddle: http://jsfiddle.net/dk8fj/