Question

为什么下面的代码将提交按钮放在FF的自己的行上但在IE中的同一行？

<style type="text/css">
#div1 form input.submit {display:block;}
</style>

<div id="div1">
<form>
hi
<input type="submit" class="submit" value="hello there">
</form>

</div>

Answer 1

发生这种情况的原因是因为您缺少<body>开放标记。当<body> open标记未明确显示在HTML中时，IE（至少6个）会误导文档树，并且涉及form元素的任何选择器都无法正常工作。

Here，我添加了body标签，它可以正常工作。

只是yesterday I documented pretty much the same bug。看起来我不得不更新描述，不仅要考虑到身体标签缺失的形式，而且其他元素在选择器中不可用。

正如doctororange指出的那样，你可以通过不在选择器中指定form来解决这个问题，但我建议你扔掉<body>标签。

Answer 2

如果您正在测试ie6，请尝试：

#div1 form .submit {display:block;}

Answer 3

因为IE不符合网络标准。

在我看来，好像form选择器正在阻碍，至少对于嵌套的选择器来说是这样的：

这有效：

#div1 input.submit{
display:block;
}

这有效：

form input.submit{
display:block;
}

这不是：

#div1 form input.submit{
display:block;
}

在IE中提交按钮和显示块

3 个答案: