Wrapping text inside input type=“text” element HTML/CSS

Question

The HTML shown below,

is displayed in a browser like so:

Answer 1

That is the textarea's job - for multiline text input. The input won't do it; it wasn't designed to do it.

So use a textarea. Besides their visual differences, they are accessed via JavaScript the same way (use value property).

You can prevent newlines being entered via the input event and simply using a replace(/\n/g, '').