How to hide the HTML5 number input's spin box ?
In Firefox browser, the default value of the -moz-appearance property on these elements is
To changing the value of text field effectively to removes the spinner.
We want the spinner to be hidden initially, and then appear on hover/focus.
In Chrome, the default value of the -webkit-appearance property on these elements is
To remove the spinner, the -webkit-appearance property's value wants to be changed as none on the
::-webkit-outer-spin-button/::-webkit-inner-spin-button pseudo classes.
Read AlsoInput tag in html
Margin: 0 is used to remove the margin in earlier versions of Chrome. Here 'inner-spin-button' pseudo class is the default value:
Using CSS to hides the spin-button for webkit browsers.
Currently Firefox 29 adds support for number elements:
To display a numeric keyboard in an iPhone browser, we can use the following code:
A pattern of \d* will also work.
This is one of the solution: