title: contenteditable=false in contenteditable=true
body: <p><strong>Problem:</strong></p>
  
  <p>I have observed an undesirable behaviour in Chrome and Opera that occurs when one joins two p
  tags by deleting the separation between them. Chrome and Opera delete contenteditable=false element(widget) and text after.</p>
  
  <p><strong>Example:</strong></p>
  
  <p><a href="http://jsfiddle.net/pCXmA/1/">example on jsfiddle</a></p>
  
  <p>html:</p>
  
  <pre><code>&lt;div contenteditable="true" class="editor"&gt;
  &lt;p&gt;This is the first paragraph.&lt;/p&gt;
  &lt;p&gt;&amp;larr;Place your cursor here and press backspace. &lt;span class="widget" contenteditable="false"&gt;widget&lt;/span&gt; Text after widget&lt;/p&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p>css:</p>
  
  <pre><code>.widget{
      display: inline-block;
      padding: 5px;
      background-color: gray;
  }
  
  .editor{
      font: 20px Trebuchet MS
  }
  </code></pre>
  
  <p><strong>Question:</strong></p>
  
  <p>Why? How fix it?</p>