Question

我在IE9中尝试了这个代码，出乎意料的是，由于标题后缺少</p>，它被搞砸了。

<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>

这是一个错误还是只是我？

更新

根据W3C

，块级元素在“p”标记内无效

<P>
    <DIV>...</DIV>
</P>

但是可以选择关闭<p>代码，

<p>content block 1
<p>content block 2
<p>content block 3
<form> ..... </form>

这似乎有效。如果未在第一个示例中明确关闭，则块元素应自动关闭<p>。

Answer 1

这似乎是一个IE9错误。

在进行了一些测试（并在表单中添加了一些<span>）后，在IE9标准模式下，看起来IE9无法识别<form> is not allowed作为后代<p>，但确认也不允许<div>。

因此，它会将元素作为p元素节点的后代插入，直到遇到第一个<div>，此时它会终止<form> 和 <p>然后在表单后插入表单主体的其余部分。

当遇到</form>时，它会将其视为非开放元素的结束标记并忽略它。

Answer 2

使用样本小提琴一分钟后，我可以确认IE9确实有问题。然而，其他浏览器也可能有同样的问题，但我还没有确认。问题是IE9认为你正在嵌套p标签内的块级元素（div）。这是不正确的。这就是造成布局错误的原因。我甚至离开p未关闭，并将div更改为span，它运作得很好。或者，您也可以关闭p代码。

Answer 3

如果您遗漏了</p>之类的内容，旧版本的浏览器并不在乎;他们试图修复它。这是一个糟糕的做法，开始被踩出来，因此它不适用于较新的浏览器/ HTML版本。

Answer 4

虽然我很欣赏约翰回答中的讽刺，但要清楚，这实际上并不是一个错误。

正在发生的事情是，布劳尔写的是试图符合标准。标准定义了给定有效HTML时的预期行为。当给出破坏的HTML时，标准是静默的，因此如果IE9试图纠正丢失的标签，则假设它属于其他地方，并且IE9错误地显示它。

您可以强制IE9尝试通过点击F12并更改兼容性设置来纠正错误的html。

由于您无法期望最终用户同意这一点，因此更好的解决方案是验证您正在生成的HTML。

Answer 5

我经常遇到这个错误。如果您关闭P，或者只是删除它们，FORM将正常运行。追踪这个问题可能很困难，因为它可以通过许多不同的方式表现出来。最近对我来说，没有视觉渲染提示，但我只是在IE9中得到了无意义的javascript错误。

我通常只能在我的表单之前删除P标记来解决问题。

IE9错误，可选<p> </p>关闭

5 个答案: