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

Question

The HTML shown below,

is displayed in a browser like so:

Answer 1

To create a text input in which the value under the hood is a single line string but is presented to the user in a word-wrapped format you can use the contenteditable attribute on a

or other element:

const el = document.querySelector('div[contenteditable]');

// Get value from element on input events
el.addEventListener('input', () => console.log(el.textContent));

// Set some value
el.textContent = 'Lorem ipsum curae magna venenatis mattis, purus luctus cubilia quisque in et, leo enim aliquam consequat.'

div[contenteditable] {
  border: 1px solid black;
  width: 200px;
}

0 讨论(0)

查看其它4个回答

发布评论:

提交评论

---

•  加载中...