垂直居中在文本输入的元素

题

我有以下输入元件（I故意省略了不是必需的实例属性）：

<input type="text" style="display: block; height: 40px; font-size: 14px; line-height: 40px"/>

在Chrome和Internet Explorer（可能歌剧太），输入内的任何文本将被垂直居中。不过，Firefox似乎忽略这一声明。设置它，而不是到display: inline-block;，或使用具有vertical-align: middle;在Firefox没有效果。

我也试着设置顶部和底部补白到13px，高度至14px，这（与字体大小的组合）将导致元件40px高。可正常工作;除了尾巴的任何字符（如克， q ，Ĵ等）在底部切断。

我正在寻找一个跨浏览器溶液用于垂直于一输入框具有固定高度对齐文本。输入元件将具有其自己的悬停和聚焦样式，所以通过垂直于40px高空间元素本身定位伪造定心是不是一个真正的选择。

干杯

解决方案

我也试过的顶部和底部内边距至13像素，并且高度设置为14px的，这（与字体大小的组合）将导致元件40像素高。可正常工作;除了尾巴（如G，Q，J等）任何字符在底部被切除。

如何高度设定只有顶部填充，以13像素（不是底部的一个）和设置为所述剩余空间，如下所示：

<input type="text" style="display: block; height: 27px; padding-top: 13px; font-size: 14px">

它可以作为预期在两个Firefox和铬;我还没有进入IE的那一刻，但我相当有信心它工作在IE浏览器了。