Вертикальное выравнивание CSS меток с полями ввода

Я разрабатываю макет формы для использования на многих страницах онлайн-системы. Являясь преданным пользователем таблиц для этих целей в течение многих лет, я начинаю привыкать к использованию CSS + меток для этого.

Одна вещь, которую мне еще предстоит освоить - это то, как разные браузеры размещают и позиционируют метку относительно поля ввода. Я приведу пример кода, а также изображение того, как это отображается в каждом браузере (IE = IE9).

  
  
  
  



    Email*
    

OK - теперь я могу выложить картинку - вот как это выглядит после изменений Ахмеда Масуда. Он был прав - файл reset.css, который у меня был (из http://html5reset.org/) не имел padding на элементе input. Однако, даже после применения изменений, по-прежнему наблюдается различие в выравнивании основы текста в ярлыке по сравнению с текстом в input. Теперь в Firefox он выравнивается по уровню, а в IE и Chrome текст метки на 1px выше.

Если я удалю ссылку на reset.css, ситуация снова изменится: Chrome становится мертвым уровнем, IE помещает метку на 1px выше текста ввода, Firefox - на 1px ниже текста ввода. Смотрите ниже:

Я должен отметить, что это очень базовый макет, просто чтобы попытаться диагностировать проблему. Позже я доработаю его. Но сначала мне нужно знать, как сделать так, чтобы весь мой текст выравнивался во всех браузерах с помощью одного CSS-решения.