HTML Input Field Consistent Cross-Browser Height And Vertical Alignment

To get your input fields to render consistently across all browsers, with pixel-perfect height and vertically-centered text, you need to use both height and line-height, and avoid vertical padding. You’ll also want to supply your own horizontal padding. Here is an example:

.input {
    height: 35px;
    padding: 0 6px;
    line-height: 35px;
}

This is tested all the way back to Internet Explorer 6 and works consistently.