Fix Position of Arrows in the NumericTextBox

Environment

Product	Progress® Kendo UI® NumericTextBox for jQuery
Product Version	2019.2.514

Description

The arrows of the Kendo UI NumericTextBox appear to be shifted in the wrong location. How can I adjust them to be centered as expected?

    <input id="numeric" class="k-textbox" />

    <script>
      $(document).ready(function() {

        $("#numeric").kendoNumericTextBox({
          min: 0,
          max: 100,
          value: 1,
          format:"n0",
        });

      });
    </script>

Solution

Usually, arrows are misplaced because of the inclusion of the k-textbox class in the input element. Remove the class to fix the appearance of the NumericTextBox.

    <input id="numeric" />

    <script>
      $(document).ready(function() {

        $("#numeric").kendoNumericTextBox({
          min: 0,
          max: 100,
          value: 1,
          format:"n0",
        });

      });
    </script>