Текст не начинается с левого верхнего края текстового поля ввода

У меня есть поле ввода с фиксированной высотой. Текст вертикально центрирован, но я хочу его в левом верхнем углу ввода.

CSS

.wideInput{
    text-align: left;
    padding:  0.4em;
    width: 400px;
    height: 200px;
}

HTML

<input class="longInput" value="<?php echo $row['foodPrice']; ?>" />

Здесь jsFiddle, демонстрирующий проблему > http://jsfiddle.net/9cR5j/

Ответ 1

если то, что удаляет padding: 0.4em; и устанавливает

padding-left:0;
padding-top:0;
padding-bottom:0.4em;
padding-right: 0.4em;

После внесения имени изменения имени здесь

<input class="wideInput" value="<?php echo $row['foodPrice']; ?>" />

вместо longInput будет wideInput

Update

Демо JsFiddle с помощью TextArea

это будет работать с textarea только потому, что вход только позволяет вводить значение в одну строку. i. no enter keyallowed или itentent wrap long text, он просто добавляет данные в одну строку

Ответ 2

Вместо input почему вы не пробовали textarea?

<textarea class="longInput" cols="30" rows="10"></textarea>

Он добавит текст из левого верхнего угла.

Ответ 3

Ваше дополнение вызывает начало текста с левой стороны. Если вы хотите, чтобы текст был по-прежнему выровнен по левому краю, удалите прописку слева:

.wideInput{
    text-align: left;
    padding: 0.4em 0.4em 0.4em 0;
    width: 400px;
    height: 200px;
}

Ответ 4

Для выравнивания влево и вправо вам нужно будет установить меньшую высоту и нижнюю часть:

text-align: left;
padding:  0.4em;
padding-bottom:190px;
width: 400px;
height: 10px;

Ответ 5

Попробуйте установить свойство line-height CSS в поле input так же, как height этого поля.

height:200px; line-height:200px;

Ответ 6

Я пытаюсь сделать регистратор, используя локальный HTML, в котором у меня есть шаблон: Phone #: 11111 Имя: NAME E-mail: [email protected] и когда вы нажмете кнопку, он добавит другой шаблон на тот же текстовое поле для новых деталей: Телефон: 22222 Имя: ИМЯ2 E-mail: [email protected] у меня есть проблема: каждый раз, когда я нажимаю кнопку, новые данные будут идти внизу. То, что я хочу сделать, это когда вы нажимаете кнопку, старые данные перемещаются вниз, а новые всегда вверху и выглядят так: Phone #: NEW DATA Имя: NEW DATA

E-mail: НОВЫЕ ДАННЫЕ

Телефон: 22222 Имя: NAME2

E-mail: [email protected]

Номер телефона: 11111 Имя: ИМЯ E-mail: [email protected] пожалуйста, помогите СПАСИБО!