Edit Contenteditable Text With Ctrl-a (select All) Removing All Child Elements

In a div with contenteditable='true', if I select all text using Ctrl-A and then type something, it will removing all the child elements within the div, not just the text. for exam

Solution 1:

So wrap the text inside the div and assign contenteditable attribute to that particular element

<divcontenteditable="true">CTRL-A and Edit Me.</div><!-- Wrap the text, don't use contenteditable for the parent element -->

Solution 2:

For code tag you can set style "display: block":

<pre style="display: block"></pre>