They are both the same height, but they are uneven.
Which of these get:
vertical-align: top;
vertical-align: bottom;
https://jsfiddle.net/6q352ysx/59/
input[type=text] {
font-size: 22px;
width: 200px;
color: #0059dd;
background: #000000;
border: 1px solid #0059dd;
}
input[type=submit] {
font-size: 22px;
color: #0059dd;
cursor: pointer;
height: 31px;
background: black;
border: 1px solid #0059dd;
font-family: "Times New Roman", Times, serif;
}