I'm doing some bug fixing for an error in IE8 and IE9 when I came across a strange error. There is a <section class="create">
tag in the HTML, but after the page loads, there is the exact same tag a little farther down the page. At first, I thought there was some bad javascript cloning the section
somehow, but I disabled javascript, and it was still there after the page loaded. This has to be the HTML parser creating this tag then, right? The rendered HTML does not match the HTML file at all.
I know that HTML parsers will add in </div>
tags or </html>
tags, etc., when they are missing, but will IE ever reopen or add a tag for some reason? If so, what causes this? If this isn't the case, what could be causing a tag that doesn't exist in the HTML to be added to the DOM when javascript is disabled?
The HTML page I'm working on is over 20,000 lines long, and there's surely malformed HTML all over the place, any of which could be causing the DOM to be rendered improperly. If there's a snippet I could add to this question that would help, let me know in the comments.
Here is the minimal HTML that replicates this problem. Note that it only happens within a form
tag, and not a div
tag. The section
tag reopens itself in IE8 and IE9 after the form element is closed, therefore creating 2 section
elements.
<!DOCTYPE html>
<html>
<head></head>
<body>
<form>
<section class="create">
CREATE SECTION
</form>
</body>
</html>
And here's a fiddle: http://jsfiddle.net/VurE6/
For the record, IE10, Chrome, Firefox, and Safari aren't displaying this behavior (that I know of).