IE 11 显示 CSS 与其他浏览器不同答案

【问题标题】：IE 11 displays CSS differently from other browsersIE 11 显示 CSS 与其他浏览器不同
【发布时间】：2014-03-09 17:34:54
【问题描述】：

我正在处理这个项目，它在不同的浏览器中显示不同（想象一下）。 CSS 在我尝试过的所有浏览器（chrome、safari、firefox）中都能正常工作，除了 IE11（再次想象一下）。这是IE版的图片：

这是假设的样子：

现在，我查看了 Chrome 和 IE 上的开发工具，结果如下。

IE：

铬：

因此，正如您在图片中看到的那样，在 IE 中，bwizard-steps button::before 和 bwizard-steps button::after 被标记出来，但它们在 Chrome 中按预期工作。

任何想法为什么会这样？我查了一下，IE11应该支持::before和::after标签。然而，它显然忽略了它们。我什至尝试过进入 IE 的兼容模式，结果看起来更糟。

【问题讨论】：

【解决方案1】：

我也遇到过类似的问题。

对我有用的解决方案是给按钮overflow: visible;

【讨论】：

【解决方案2】：

问题很可能是您将button 标签作为ul 标签的直接后代。在有效的 HTML 标记中，ul 的唯一直接子级应该是 li。

您应该将按钮包裹在li 标记中——但随后您将不得不进行一些CSS 更改，以使您的列表项不是垂直的。 float: left; 对它们进行其他更改，以使它们以您想要的方式显示。

编辑：如果您向我提供适当的 HTML 和 CSS（最好是在 jsfiddle 中），我可以提供更详细的解决方案来进行精确改进

【讨论】：