0

I have a contenteditable <p> tag

<p id="maincontent" class="conted" spellcheck="false" contenteditable="true"></p>

And I have a function that insert HTML at the caret location.

Sometimes I want to add a breakline using that function. I could then insert a <br/> tag

But in Chromium browsers, the <br/> tag doesnt break line on the first line of a content editable div.

<p id="maincontent" class="conted" spellcheck="false" contenteditable="true">blabla this is my first line<br/></p>

Adding <br/> tag doesnt break line on first line

<p id="maincontent" class="conted" spellcheck="false" contenteditable="true">blabla this is my first line<div>this is my second line.<br/></div<</p>

But it does on every other line.

Alectrona
  • 55
  • 6
  • I think your answer can be found in this question. https://stackoverflow.com/questions/15008205/br-not-causing-new-line-on-chrome – Rick Bronger Jun 25 '20 at 06:21
  • Not applicable to my contenteditable div. I had a similar workaround tho, consisting of adding a
    tag followed by a zero-width space character, encapsuled into a non-contenteditable span tag : ​. But then it prevents the user from returning to the upperline using backspace     – Alectrona Jun 25 '20 at 06:38

1 Answers1

0

Using the obsolete feature "document.execCommand", I have found a workaround :

document.execCommand('insertText', false, "\n");

This insert a new line, anywhere

Alectrona
  • 55
  • 6