输入大于它应该是

Question

你好我的同胞CSS爱好者。通常情况下，我无法回答CSS问题。

在Chrome和IE11中发生错误，Firefox呈现相同大小但截取不同的错误。

我有一个inputfield和一个div充满了文本，他们应该有相同的高度，并应与父母的字体大小。问题在于输入字段比预期的要大。

演示：http://jsfiddle.net/7Lg70qc4/

的div行为就像我所料，它的高度是font-size + padding * 2，但inputfield比这更大。

由于填充是固定的，我不能将高度设置为em，但字体大小不是。

为什么input大于div？

Answer 1

你必须定义:first-line伪元素的输入，使你的两个元素相同的高度。

input:first-line { 
    display: inline-block;  
} 

Here你可以找到更多的信息，为什么它的作品。