css - IE9 在应用边框之前不正确地使用 CSS'ing 一个 FIELDSET

Question

所以我得到了一个很好的 float 表单布局，它在 FF 和 Chrome 中工作得很好，但在 IE 中却不行(震惊，恐怖!):

所以，我开始测试，第一个镜头是在 IE 上的 FIELDSET 添加一个 1px 的粉红色边框，看看它的边框在哪里，这就是我得到的:

...整洁的 IE，整洁。所以我记得一些关于“显示”的事情触发 IE 布局引擎中的某些东西或其他东西以使东西表现得像他们应该的那样，所以我要去看看谷歌。但似乎 hasLayout 的东西是 IE7-ism。

细节是这样的:没有正确定位的元素是一个 FIELDSET。它只有一个 CSS 属性； “空白:nowrap；” (它下面的标签带有 float 样式)。添加“新的”clearfix 不起作用。

所以.. 任何人对 IE 中到底发生了什么有任何想法？另外，顺便说一句，条件语句似乎对我不起作用 (...)，这也很奇怪。

啊...记忆起我为什么如此讨厌 IE 的温暖和光芒...

Answer 1

不是一直都是这样吗？您花时间为 StackOverflow 写了一篇文章，并且在您发布它时关注了一些您以前没有看到的东西？

所以...这似乎与 IE9 在渲染过程中未设置宽度有关。当边框放在 FIELDSET 上时，它强制宽度至少为 2px，这足以强制换行。将宽度设置为 0px 仍然会导致问题，但宽度为 1px(或更多)时，它会按预期进行包装。最后，我只是简单地在 CSS 类中添加了一个“clear: left”(这可以说是正确的，因为这是我所期望的)，然后一切又恢复正常了。

所以...在某些情况下，IE9 似乎不会在渲染(渲染？)元素(在本例中为 FIELDSET)上设置宽度。这可能与 hasLayout 相关，但我不能 100% 确定。这可能是由于 FIELDSET 中的所有元素都被 FLOAT 左移所致。