【问题标题】：Resolving 'Legend' conflict IE 9解决“传奇”冲突 IE 9
【发布时间】：2013-07-10 04:02:24
【问题描述】：

以下 CSS 适用于 Firefox、Chrome 和 Safari。但由于某种原因，IE 9 没有显示legend。其他 CSS 在 IE 9 中正确显示。我已经尝试过但找不到答案。它应该显示带有白色文本和黑色边框的橙色 legend 标题。

CSS：

legend{
    color: #fff;
    background: #ffa20c;
    border: 1px solid #781351;
    width: 49.2em;
    padding: 2px 6px
}

当我通过尝试学习时，我的样式表是一团糟。我认为它可能在某个地方存在冲突。

完整样式表可以查看here:

【问题讨论】：

在这一系列事件发生后的某个时间，整个站点重新启动。我已经归档了旧文件。如果你想看看这个Flash建议的结果，至少暂时可以查看mconchicago.com/MCON

【解决方案1】：

您的问题不仅出现在橙色标题上，您的文档标记上还有 61 个错误和 15 个警告。

请参阅this link 以准确了解错误是什么、它们位于何处以及如何解决它们！

另外，您应该阅读一些有关 HTML 的内容：

Google's HTML, CSS, and Javascript from the Ground Up

【讨论】：

【解决方案2】：

我会冒险猜测它不起作用，因为您试图将标题放在图例元素中。图例仅适用于表单，但这是页面/部分标题而不是表单图例。

将替换为

并相应地更新您的 CSS。

您还应该习惯于编写有效的 HTML，因为无效代码也会导致浏览器之间的不一致，因为它们会尝试以自己的方式理解您的代码。使用 W3C 验证器并解决错误

【讨论】：

【解决方案3】：

在这一系列事件发生后的某个时间，整个网站重新启动。我已经存档了旧文件。如果你想看看这个建议的结果，至少暂时可以查看http://www.mconchicago.com/MCON/

【讨论】：