numeric input playground

by Atty Eleti

HTML

<label>Text: <input type="text" /></label>
<label>Number: <input type="number" /></label>
<label>Telephone: <input type="tel" /></label>
<label>Digits regex: <input type="text" pattern="\d*" /></label>
<label>Digits regex no-validate: <input type="text" pattern="\d*" novalidate="" /></label>
<label>Telephone regex: <input type="tel" pattern="\d*" /></label>
<label>Telephone regex no-validate: <input type="tel" pattern="\d*" novalidate="" /></label>
<label>Number with regex: <input type="number" pattern="\d*" /></label>
<label>Number with no-validate regex: <input type="number" pattern="\d*" novalidate="" />
</label>
<label>Text with inputmode=numeric: <input type="text" inputmode="numeric" />
</label>

CSS

label {
    display: block;
    margin-bottom: 0.5em;
}


/* jsFiddle head hack */
</style>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>