形式的文本輸入錯位

Question

HTML：

<form action="search.php" method="GET"> 
    <input type="text" name="q" value="Search for an item..." width="150" style="border: solid 1px black; padding: 3px;" /> 
    <input type="image" src="images/search_icon.png" style="width: 24px; height="30px;" /> 
</form> 

我得到什麼：

由如果我嘗試在按鈕上使用填充，它會將整個表單向下移動。

Answer 1

嘗試設置中間輸入的垂直對齊屬性。

input { 
    vertical-align: middle; 
} 

jsFiddle example。