I have a long text (with multipe-line) inside textarea. Now I'd like to find some substrings in the text and cover it with the aboslute positioned div (like cover an expression inside the text with some tag). For example:
Lorem ipsum dolor sit <TAG_1> amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea <TAG_2> commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit <TAG_3> id est laborum.
So here I need to find positions of <TAG_1>, <TAG_2> and <TAG_3> (in pixels), and based on them create 3 divs with absolute position to cover them.
I've tried also to implement it using contenteditable="true"
div (to have these tag-divs and the rest of text displayed inline), but the problem is that it breaks lines after the tag.
Is it possible or maybe there is a better approach?