輸入和按鈕不對齊在Safari中

Question

我試圖讓一個文本輸入和一個按鈕在Safari 7.0.4中排隊，它根本不起作用。

http://jsfiddle.net/LFFTP/

form { 
    height: 30px; 
    background: #000; 
    padding: 0; 
    margin: 0; 
} 
input { 
    border: 0px; 
    width: 60px; 
    height: 30px; 
    background: #900; 
    padding: 0; 
    margin: 0; 
} 
button { 
    border: 0px; 
    height: 30px; 
    background: #fff; 
    padding: 0; 
    margin: 0; 
} 

<form> 
    <input type="text" value="Input" /> 
    <button>Button</button> 
</form> 

你會在Safari中發現，該按鈕是1px的降低（由小片黑色的這是從表格的背景，可見所示）。我找不到原因或解決方法。

Answer 1

我不知道爲什麼，但它是與垂直對齊的事情。

地址：

input, 
button { 
    vertical-align: top; 
} 

看來你可以將它添加到button，但更好的安全比抱歉，我猜。

Fiddle