Выравнивание кнопок-изображений в формах

Если просто вывести поле и кнопку это будет выгядеть так:

Как видите по вертикали поле ввода и кнопка на разном уровне.

Код:

<form action="#">
<input type="text" size="20" maxlength="50" />
<input type="image" src="poisk.gif" alt="Поиск" />
</form>

Для выравнивания поля ввода и кнопки по вертикали я использую CSS-свойство vertical-align:middle:

<form action="#">
<input type="text" style="vertical-align:middle;" size="20" maxlength="50" />
<input type="image" style="vertical-align:middle;" src="poisk.gif" alt="Поиск" />
</form>

Можно использовать глобальные CSS-селекторы:

<style type="text/css">
   input { style="vertical-align:middle;"}
</style>
<form action="#">
   <input type="text" size="20" maxlength="50" />
   <input type="image" src="poisk.gif" alt="Поиск" />
</form>