以下是完整的细分：

Question

我的网站似乎适用于所有浏览器，但IE 8。所有内容都可以通过iFrame加载。

这是我的HTML代码：

<head>
   <title> Title </title>
   <link rel="stylesheet" type="text/css" href="style.css" media="screen" />
   <script type="text/javascript" src="respond.min.js"></script>
</head>

<body>
    <iframe src="http://instagram.com/p/cR5BORA8Ij/embed/" 
            width="300" height="400" frameborder="0" 
            scrolling="no" allowtransparency="true" id="myFrame"></iframe>      
</body>

有关我可能做错的任何建议吗？

Answer 1

以下是完整的细分：

重现步骤：

在position:relative元素

上创建一个html的网页

<html style="position:relative">
    <head></head>
    <body>TEST</body>
</html>

这是一个小提琴测试页面就是这样：

http://jsfiddle.net/KyleMit/DZbt5/show/light

现在在iFrame中使用该页面并在IE8中打开

<html>
    <head></head>
    <body>
        <iframe src="http://jsfiddle.net/KyleMit/DZbt5/show/light/"></iframe>
    </body>
</html>

Here's a fiddle that should work in all browsers EXCEPT IE8

解决方案：

如前面的答案所示，您可以从原始html页面中删除position:relative，但您可能无法访问该页面或无法更改该页面。

相反，您可以简单地将相对位置添加到iframe元素本身：

iframe {
    position: relative;
}

Working Demo in Fiddle - Also works in IE8

其他实例

此处也提出了问题：

Answer 2

问题iFrame content doesn't show in IE8：

只需从iframe内容中删除以下规则：

html { position: relative; }

iFrame未加载IE 8

2 个答案:

以下是完整的细分：

重现步骤：

http://jsfiddle.net/KyleMit/DZbt5/show/light

Here's a fiddle that should work in all browsers EXCEPT IE8

解决方案：

Working Demo in Fiddle - Also works in IE8

其他实例