title: Center text in html number input
body: <p>I have a number input in html. I want to center the text (i.e. the input) that is inside. I of course did:</p>
  
  <pre><code>text-align: center;
  </code></pre>
  
  <p>which sort of works. The problem is though. The text is now centered when those arrows are shown. But when the arrows disappear, the text stays at the same position which now of course isn't the center anymore.</p>
  
  <p><img src="https://i.stack.imgur.com/e0vNx.png" alt="Without arrows, the text does not appear centered."></p>