jQuery .show() makes input box shiver

Question

My code:

$('input').hide().show(10000);

I have tested the jsFiddle with Google Chrome 14 on Windows 7 and Mac OS 10.7.

The input box shivers towards the end of the animation. Is this a bug or the expected effect?

Answer 1

It is not a bug I think. The truth is that the browser is usually unable to set non-integer width or height of an input element, trying to round, for example, height: 11.007252845381956px to height: 11px or 12px.

The shivering disappears once you set vertical-align as follows (fiddle):

input {
    vertical-align: top;
}

Therefore I can assume that the vibration comes from browser's inability to determine (or round) height, line-height or any other property that influences the vertical alignment.