HTML contenteditable with non-editable islands

Question

I have sort of browser based WYSIWYG editor where users can edit documents-templates.

Document-template is an ordinary html with some special \"merge code placeholde

Answer 1

Here's a solution I'm using in a project :

  Editable text  - Non editable text

With the corresponding CSS to see the result :

div {
  border: 1px solid black;
  display: inline-block;
  max-width: 200px;
}

Here's the result : http://www.cssdesk.com/rULJM