html - 来自按钮的神秘填充

Question

我基本上有一个问题，我的按钮应该与我的输入框位于相同的高度，而且我在网上阅读的所有信息似乎都在说我在做什么是正确的，但是尽管按钮上没有填充它仍然比它应该做的低 3px 左右。

可以在这里看到:http://jsfiddle.net/spadez/8Ej9U/embedded/result/

这是它的属性:

#search_form .button {
    width:70px;
    line-height:0;
    font-size:0;
    text-indent:-999px;
    color: transparent;
    background: url(http://i.imgur.com/LCQSXXY.png) no-repeat #a6668e center;
    border: 1px solid #3079ED;
}

我的问题是，如果按钮和输入字段都是 31 像素且没有填充，为什么它们位于不同的高度，我应该如何解决这个问题？

Answer 1

他们只是在线上的位置不同。为输入指定一致的 vertical-align(可能是 middle)。