HTML5 - contenteditable="false" nested in contenteditable="true"

I'm having very different behaviors with nested contenteditable="false" elements within a parent contenteditable="true:

  <pre>
  <div contenteditable="true">
    <span>I'm supposed to be editable</span>
    <p contenteditable="false">I'm NOT supposed to be editable.<br>Neither should I.</p>
    <span contenteditable="false">I'm NOT supposed to be editable.</span>
  </div>
  </pre>

This fiddle exemplifies how two elements that should not be editable are in fact editable with Inteet Explorer 11 but not Google Chrome. What gives?

I have seen some people applying a strange workaround by setting them to "true", which indeed works for IE, but has the opposite effect on Google Chrome (as it should).