Notice: A non well formed numeric value encountered in /home/content/p3pnexwpnas02_data01/82/41786482/html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in /home/content/p3pnexwpnas02_data01/82/41786482/html/wp-content/plugins/crayon-syntax-highlighter/crayon_formatter.class.php on line 119
<input type="number"> . The input type number tells the browser / device that only numbers are allowed within the input value. However, when you use Input Type Number you’ll notice that on Web-Kit based browsers like Chrome and Safari etc there would be an up and down arrow or spinners coming up within the input type number. While this is a helpful feature, not every time would you want to have these spinners, especially when you want it to look consistent across browsers and devices.
These spinners or arrows in the Input type number can be removed easily using CSS. These come up only on a web-kit browser and hence by targeting the webkit based CSS properties we can remove it. The CSS to remove the spinners in webkit browser and to remove the arrows from input type number on firefox is as following :
Please note that this CSS would only remove the spinners or the arrows within the Input type number on a webkit browser like chrome or safari etc. However, it would NOT remove the other features like increasing or decreasing the number using mouse scroll wheel etc.
Hope you found this article helpful . Please do like us on Facebook and do follow us on Twitter.