title: Prevent arrow keys from changing values in a number input
body: <p>I have an input control on a webpage similar to this:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input type="number" name="value" /&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>If this control has focus and I hit either the up or down arrow keys, then the value in the textbox increments or decrements (except in IE).</p>
  <p>I would like to disable this feature, preferably using CSS. I already have the spinner buttons removed using CSS. I realize I could use JavaScript to capture the <code>keydown</code> event, but I want to allow the arrow keys to continue to scroll the page up or down.</p>