I tried this code in IE9, unexpectedly it got screwed because of a missing </p> after heading.
live demo
<style>
#MyForm div {
width: 200px;
height: 30px;
float: left;
}
</style>
<div>
<p><b>Login</b>
<form id="MyForm" action="test.html">
<div>
<label>My Email</label>
<input />
</div>
<div>
<label>My Password</label>
<input type="password">
</div>
</form>
</div>
It is a bug or just me?
Update
A block level element is invalid inside a "p" tag as per W3C
<P>
<DIV>...</DIV>
</P>
But it's optional to close <p> tag so,
<p>content block 1
<p>content block 2
<p>content block 3
<form> ..... </form>
This appears valid. A block element should automatically close <p> if it's not explicitly closed as in first example.
This does appear to be an IE9 bug.
After doing some more testing (and adding some <span>s into the form), in IE9 Standards Mode it looks like IE9 fails to recognise that a <form> is not allowed as a descendent of a <p> but does recognise that a <div> is also not allowed.
Consequently it inserts elements as descendants of the p element node until it encounters the first <div>, at which point it terminates the <form> and the <p> and then inserts the rest of the form body after the form.
When it encounters </form> it treats it as an end tag for a non-open element and ignores it.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With