The elements are aligned by its baselines by default. In your first example, there is no text, so the baseline of the element is determined by the element itself as a box, meaning the browser "sees" the baseline as the bottom of the element.

Take a look at vertical-align's possible values and see what best suits your needs. middle, top and bottom will all work here since your button is the same size as the input, but choose based on your future plans.