JSFiddle - React, Tailwind, and code Playground
by kein1945
HTML
<pre id="edit-me" contenteditable="true" spellcheck="false"> Look at this line
with <span class="dotted">word dotted</span> in text simple node.
Anouther line started
<span class="dotted">dotted</span> with too...
<span class="dotted">Agains buggy dotted span</span> in text node
Look at me.
Not starting only good span dashed
<span class="dashed">like this</span>.
Good span without inline-display
<span class="dashed">realy good</span>. Yep.
</pre>
CSS
span.dotted {
display: inline-block;
border-bottom: 1px dotted red;
cursor: pointer;
}
span.dashed{
border-bottom: 1px dashed red;
cursor: pointer;
}