title: input type="number" mouse wheel does not scroll
body: <p>I'm stumped why the mousewheel will not increment/decrement the value in a simple form element.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input type="number" step="0.125" min="0" max="0.875"&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>It works on this snippet just fine, but not when I create a simple generic html document:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;&lt;/head&gt;
  &lt;body&gt;
      &lt;form action=""&gt;
          &lt;input type="number" step="0.125" min="0" max="0.875"&gt;
      &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>When I view this in several browsers, the mousewheel does not scroll. I've disabled browser extensions and such as well. Several other machines around me behave the same way.</p>
  
  <p><strong>What causes this to not work? Is this an OS/browser issue?</strong> </p>
  
  <p>I almost feel like this might be something deeper, possibly the type of mouse/driver issue?</p>
  
  <hr>
  
  <p>What I have tested on:</p>
  
  <ul>
  <li>Win 7</li>
  <li>Chrome - fail</li>
  <li>Firefox - fail</li>
  <li>Firefox Dev Edition - fail</li>
  <li>Safari - pass</li>
  <li>IE11 - fail</li>
  <li><p>IE9 - fail</p></li>
  <li><p>OSX</p></li>
  <li>Chrome - fail</li>
  <li>Safari - fail</li>
  <li>Firefox - fail</li>
  </ul>