Add A Placeholder To A Number Input

Posted By Weston Ganger

I needed to add a placeholder to a number input. Apparently this is only supported in Chrome.

The solution I found was to start with a text input with a placeholder and then on focus change it to a number.

<pre>
<code class="language-markup">
<input placeholder="Amount" onfocus="this.type = 'number';">


So it will now have a placeholder until the input comes into focus.


Related External Links:

- [Stack Overflow - how-to-display-placeholders-text-in-html5s-number-typed-input](http://stackoverflow.com/questions/7401495/how-to-display-placeholders-text-in-html5s-number-typed-input)

Article Topic:Software Development - HTML / CSS

Date:April 07, 2016