StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>This is how browser (HTML parser) works, since <code><div></code> is a <a href="http://dev.w3.org/html5/markup/common-models.html#common.elem.flow" rel="nofollow">Flow element</a> and <code><p></code> is a <a href="http://dev.w3.org/html5/markup/common-models.html#common.elem.phrasing" rel="nofollow">Phrasing element</a>, in most case an phrasing element cannot contain any flow element, this is called <strong>misnested tags</strong>, HTML parser would fix these issues magically with some certain steps: </p> <ol> <li>When reading <code><p></code>, it generates a <code><p></code> element</li> <li>When reading <code><div></code>, since <code><div></code> cannot reside in a <code><p></code> element, HTML parser closes the last <code><p></code> element, then open an <code><div></code> element</li> <li>When reading <code></div></code>, closes the <code><div></code> element</li> <li>When reading <code></p></code>, since previous <code><p></code> element is closed, parser recogonizes it as a <strong><code><p></code> element missing a start tag</strong>, so parser automatically inserts an <code><p></code> start tag here to create a complete <code><p></code> element</li> </ol> <p>Thus, the final DOM construct is:</p> <pre><code><p id="test"></p>  <div> box1 <div> box in box1 </div> </div> <p></p>  </code></pre> <p>It's obvious that the <code><div></code> and <code><p></code> is at the same level, not forming a containing relation, so delegate fails here.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload