I'm trying to create a user experience that looks like this:
Basically, there is a <span>
of non-editable text followed by a textarea/input and some other non-editable <span>s
. A simple textarea/input poses no problem when the length of the gap is short, but when it's long, the layout gets pretty awkward. I've looked into contentEditable
, but I'm not sure if it's what I need (I've also read several posts suggesting it's evil).
Do I have any other options?
Perhaps the contentEditable
property can help you. Have a look here https://www.w3schools.com/JSREF/prop_html_contenteditable.asp
There is a tipical example https://www.w3schools.com/JSREF/tryit.asp?filename=try_dom_body_contenteditable
You may switch on an editable mode for a span or inline div, for instance.