I noticed that the display changes with different browsers. I I would set the arrows always visible and which cover the entire height. I would only white arrows on a black background. I need also to set default value to 2. thanks for your help
As durbnpoisn said, you can simply set a value attribute to fix your default value problem.
Since you gave your input field a type, you're referencing to the HTML5 input field, which automatically includes those arrows. To get some custom arrows, you have to play around with -webkit-appearance: none;. In order to do so, I've found 2 simple explanations to achieve this here and here.
Combined together this would look somehow like this: