title: Positioning buttons beside the input field using CSS
body: <p>I want to set the position of buttons next to the input field, but the PLUS button needs to be above the MINUS button. So the height of class button will be same as input field. Could you help me with that? Thank you!</p>
  <p><a href="https://i.stack.imgur.com/n3Ezy.png" rel="nofollow noreferrer">Current result of code</a></p>
  <pre><code>    &lt;body&gt;
      &lt;div class=&quot;input&quot;&gt;
          &lt;input name=&quot;number&quot; type=&quot;text&quot; readonly value=&quot;0&quot; class=&quot;arrowsChange&quot;&gt;
        &lt;/div&gt;
  
  
        &lt;script&gt;
          var inputNumber = document.querySelector('.arrowsChange');
          inputNumber.insertAdjacentHTML('afterend', '&lt;div class=&quot;buttons&quot;&gt;&lt;button onclick=&quot;inc()&quot;&gt;+&lt;/button&gt;&lt;button onclick=&quot;dec()&quot;&gt;-&lt;/button&gt;&lt;/div&gt;');
  
            function inc() {
              let number = document.querySelector('.arrowsChange');
              number.value = parseInt(number.value) + 1;
              }
  
              function dec() {
              let number = document.querySelector('.arrowsChange');
                  if (parseInt(number.value) &gt; 0) {
                  number.value = parseInt(number.value) - 1;
              }
              }
        &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>