html - CSS3 在我网站的 IE 中不工作

标签 html css internet-explorer

我真的很难为 Internet Explorer 开发。

下面是一个元素的快照,它在 IE9 中显示,在 Google Chrome 中显示在下方,它在 Firefox 中看起来也一样。

此页面上的某些内容在 IE9 中无法正常工作...

  • 导航栏,链接在 IE 中停留在顶部而不是垂直居中
  • 导航栏没有应用IE中的框阴影
  • 边栏和内容框在 IE 中没有阴影或斜 Angular
  • 标签框在 IE 中没有圆边
  • 在内容部分,请注意页面右侧的 2 个标签“CSS”和“FONTS”被下推,在 Chrome 版本中它们是对齐的。

该元素不在线,所以我无法显示它,但我已将 header 部分放入此处的 JSSFiddle 页面 http://jsfiddle.net/kenLs/3/embedded/result/您可以看到 header 的这个 JSFiddle 在 IE9 中可以正常工作。

这真的让我感到困惑,它适用于 JSFiddle 但不适用于我的网站。我已经查看了我能想到的一切以使其正常工作。我什至添加了 <meta http-equiv="X-UA-Compatible" content="IE=9" />到我的标题。我的页面上有一些 HTLM5 元素,但我将它们全部替换为常规 div 只是为了使用 IE 进行测试,我所做的一切似乎都没有改变任何这些问题。

IE9 快照
IE 9

Chrome 快照
chrome


我知道这很难调试,因为该元素不在线,但如果您知道为什么会发生这种情况,我真的很想知道。


更新

我刚刚意识到,在那个 JSFiddle 上,如果我关闭兼容性 View ,那么即使是标题也会看起来像我图片中的那个

我还添加了另一个简单的 JSFiddle 测试,它只有我的标签的代码,即使这个小代码在 IE 中也不能正常工作,我必须打开兼容模式才能工作,否则 Angular 是方形的 http://jsfiddle.net/j9Qe3/1/

最佳答案

如果它在 jsfiddle 中有效,但在您的网站上无效,我想知道您是否使用了文档类型,或者是否在文档类型之前放置了任何会使 IE 进入怪癖模式的内容。

关于html - CSS3 在我网站的 IE 中不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8632262/

相关文章:

html - 如何在不改变父级显示样式的情况下水平对齐两个按钮

HTML5 响应式网页设计 : Fixed Header Not Working

css - 如何在 IE6 中覆盖通用选择器字体大小

html - IE中的Image onLoad问题

html - 如何使链接与 Bootstrap v4 中的 card-img-overlay 一起工作

html - 如何在 HTML 中仅概述元素

html - 即使列数为 12, Bootstrap 中的列也不适合

html - 在不影响加载时间的情况下在网站背景中获得高质量图像?

Javascript 未在 Internet Explorer 中实现错误

HTML\CSS : change cell background for hover state with CSS