css - 基于 Bootstrap 的主题在 IE10 中被破坏

Question

http://metagraf.github.io在 IE10 出现之前，它在所有经过测试的浏览器中都表现良好。在 IE10 中查看时，顶部菜单覆盖整个页面。 可以在此处查看该页面在 IE10 中的外观截图:https://dl.dropboxusercontent.com/u/2897577/ie10.png 关于如何解决此问题的任何想法？

问候奥斯卡

Answer 1

所以当我在 IE 10 中运行有问题的站点时，确实，顶部菜单在 IE 10 中看起来确实有问题。

问题的直接来源是导航栏中的 img。

如果您按下 F12 并使用 IE 的开发人员工具栏，然后如果您将 img 的 width 属性设置为 auto 只是被取消选中(这样 auto 不再是值，网站突然看起来正常了。

深入研究这个问题，这里是 Bootstrap 中 img 的 css 设置:

img {
  width: auto\9;
  height: auto;
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}

好的，width: auto\9 到底是什么？ 好吧，看起来这是一个 IE hack，但不适用于 IE 10。

1. CSS \9 in width property
2. http://www.paulirish.com/2009/browser-specific-css-hacks/

因此，作为快速修复，我想您可以做的一件事是设置自定义 css 属性 navbar 中的 img 与 img 的宽度完全一致。