Почему в инпут не влезает все value?

Question

[Илья Ломаев]

В инпут не влезает все value, присвоенное через javascript. Получается так:
Как пофиксить?

<div id="answerBlock">
                <input id="answerInput" readonly type="text">
                <button id="nextQuestion" type="button" onclick="">
                    К СЛЕДУЮЩЕМУ ОПРЕДЕЛЕНИЮ
                </button>
            </div>

#answerInput {
    height: 400px;
    background: #693D3D;
    border: none;
    padding: 16px;
    font-weight: 400;
    max-width: 100%;
    width: 100%;
    display: inline;
    color: #fff;
    border-radius: 6px;
    &:focus-visible {
        border: none;
        outline: none;
    }
}

Comments

[Anonymous Penguin]

Зачем ты используешь инпут для вставки текста на страницу?

[Илья Ломаев]

Anonymous Penguin, А что использовать? Текст вставляю через JS (присвоение value)

[Anonymous Penguin]

Илья Ломаев, инпуты сделаны для ввода текста пользователем... А для вывода текста используй обычный параграф <p>, для изменения текста в нем - innerHTML

Answer 1

[Александр]

Не тот элемент формы для текстовых макаронин.
Используйте textarea, оно точно подойдет для того, чтобы был перенос строки