Выравнивание текстового поля в форме

Question

Ив использовал следующий код CSS, чтобы выровнять свои элементы формы:

form { position:relative; } 
form input { position:absolute; left:11em; } 

Однако элемент TextArea правильно не выровнен с остальными элементами. Я пробовал следующее, но это не работало

form input,textarea { position:absolute; left:11em; } 

Любой способ исправить это?

Thank you.

Answer 1

Никто не сможет решить это, не видя текущего результата; Как правило, я избегаю абсолютного позиционирования, если вы не делаете что-то особенно сложное, например всплывающие подсказки, не можете ли вы добиться того, что хотите использовать поля?

Answer 2

Похоже, это ошибка Firefox, em-specific. Я думаю, что это связано с этой ошибкой о Firefox прокручиваемым и его шрифта: Mozilla 3.0.8 and Chrome height in em bug workaround

Ваше позиционирование должно работать, если добавить следующий код:

form { font: 11px Arial; } 
form textarea { font-size: 100%; font-family: inherit; } 

Кроме того, еще один обходной путь использует пикселей вместо Эма ,

Answer 3

Это не относится к вопросу, но почему бы не использовать «text-align»? Абсолютное позиционирование для размещения элементов формы звучит немного странно в моих ушах.

Answer 4

Если вы должны использовать абсолютное позиционирование таким образом, считаете ли вы использование margin вместо left? Как указывали другие, трудно устранить проблему без дополнительной информации.