How to solve buggy line-height on input fields?

Issue

How do you give an input field, with fixed height, a cross-browser vertical alignment of the text it holds?

As of now, it seems line-height is my best option. However, on a webkit browser like Chrome or Safari, the cursor jumps to a top-alignment when copy/pasting.

I've noticed Wordpress seems to have a solution for this, with their wp-login form.

Does anybody know how Wordpress manages to do this?

CSS

input {
    width: 240px;
    height: 32px;
    line-height: 32px;
    font-size: 18px;
}

Solution

I use a set line-height for the whole document, vertical-align: middle for both labels and inputs and padding.
I also redefine font (family and size) for input, the same as for label because browsers already have their default like 13.3px...
Finally border: 1px solid someColor will help for browsers with 1 more px or an inset.

No height.

Then comes Chrome and its select. Oh @*$£#... isellsoap forms.css nailed it, by removing and redefining everything, except it uses height and not padding (imo it's less versatile)

Answered By - FelipeAls