Вертикальное выравнивание в поле ввода

[ypeskov]

Добрый день,

второй день бьюсь головой об стенку.
имеется следующий код:

</span><div id="email_input">  
		  <input type="text" name="email_address" class="email_field" id="email_pole" />  
		  <img src="<?php echo CURRENT_TEMPLATE_DIR; ?>/images/wrong_img.gif" id="busy_email" alt="mail is busy" />  
		  <img src="<?php echo CURRENT_TEMPLATE_DIR; ?>/images/ok_img3.gif" id="not_busy_email" alt="mail is free" />  
		  <input type="hidden" id="email_status" name="email_status" value="not_ok" />  
	  </div><span class="postbody">

к нему есть соответствующий css:

</span>.email_text { position: absolute; top: 28px; left: 6px; width: 43px; overflow: hidden; text-align: right; color: #46708d;}  
   #email_input { position: absolute; left: 53px; top: 22px; width: 188px; color: #000000; }  
   #email_pole { font-size: 11px; border: 1px solid #99b9ca; padding: 5px 0px 6px 0px; width:186px; }<span class="postbody">

собственно это я уже путем проб и ошибокк вышел на использование padding чтобы выровнять текст по центру по вертикалив поле ввода.

vertical-align и line-height тупщ не дают никакого эффекта.

Но тут вылезла другая проблема. дальше в зависимости от проверки на сервере справа от поля ввода могут появляться картинки.
Я так понимаю изза разного размера шрифта в ОС линукс и винде чтобы картинка совпадала с полем ввода надо либо padding-bottom: 5px либо 6px

В реалиях пока ориентируюсь на виду, но но но. заказчик хочет чтобы везде было одинаково. Как решить эту проблему?

вид из фаерфокса в линуксе:
(подскажите куда без регистрации можно залить картинку чтоб выложить сюда?)

в общем вопрос, какие еще есть методы ввертикаьного выравнивания текста в поле ввода. самое странное что text-align при этом работает как надо.

 

[serega200606]

Ypeskov, я в таких случаях обычно использую таблицы. Можно указать border=0 чтоб ее не было видно. Две ячейки в строке в одной из которых поле для ввода текста, а в другой картинка. И так как в ячейках таблицы по умолчанию все размещается по центру по вертикали, то в данном случае браузер сам поставит поле для ввода и картинку на один уровень не зависимо от типа браузера, размера шрифта или операционной системы.
Хотя как я понял в Вашем случае используется безтабличная верстка. Но если применить таблицу, то ничего страшного - заказчик же не сказал каким способом должна быть решена проблема и в код он не полезет. Заказчику всегда важен результат

Поэтому таблица Вам поможет в данном случае

 

[trueW3C]

Для полей ввода не действуют установленный шрифты в html,body. Задай для них отдельно.

Насчет картинки. Задай паддинг на глаз, высоту поля равной высоте картинки и overflow: hidden;

input {
	font: 11px Tahoma, Geneva, sans-serif;
	height: 25px;
	padding: 7px;
	overflow: hidden;
}

Если не на глаз... (25 - 11)/2 - паддинг сверху и снизу (с права и слева на глаз)