我的导航已固定在页面顶部。然后我在下面有内容。 IE是垃圾,z-index没有跟随。这是针对当前版本的IE。
<body>
<nav>
<div id="logo"></div>
<div id='menu'>
<p data-menuanchor='Home'><a href="http://satprepget800.com/#Home">Home</a></p>
<p data-menuanchor='Resources'><a href="http://satprepget800.com/#Resources">Resources</a></p
<p data-menuanchor='About'><a href="http://satprepget800.com/#About">About</a></p>
<p data-menuanchor='Contact'><a href="http://satprepget800.com/#Contact">Contact</a></p>
<p><a href="books/">Books</a></p>
<p><a href="blog/">Blog</a></p>
</div>
<div id='social'>
<a class="desktop" href="https://www.facebook.com/SATPrepGet800" target="_blank"><img class="desktop" src="../wp-content/themes/Get 800/img/facebookIcon.png"></a>
<a class="desktop" href="https://twitter.com/satprepget800" target="_blank"><img class="desktop" src="../wp-content/themes/Get 800/img/twitterIcon.png"></a>
<img id='share' src="../wp-content/themes/Get 800/img/shareIcon.png">
</div>
</nav>
<div id='postContainer'>
<div class="row "><div class="six columns "><p></p>
<h3 style="text-align: center;"><b>SAT Math Overview</b></h3>
<div class="video-container" style="text-align: center;"><iframe src="//www.youtube.com/embed/5ZdRJz0WSHM?rel=0" width="560" height="315" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>
帖子容器包含iframe视频..
nav {
background-color: #01235f;
width: 100%;
height: 10%;
top: 0;
position: fixed;
z-index: 9; }
#postContainer {
width:70%;
margin: auto;
margin-top: 10%;
font-family: Calibri, sans-serif;
font-size: 22px;
z-index: -1;
position: relative;
}
为什么这不起作用。其他所有浏览器都有效。
答案 0 :(得分:0)
IE 支持这些功能。
如果您没有看到它正常工作,我的猜测是该页面正在以Quirks模式呈现。此模式将IE置于IE5兼容模式,这会消耗大量浏览器功能。
您可以通过打开开发工具(按F12)来检查浏览器模式,然后转到“模拟选项卡”。如果浏览器模式显示“5”,那么它就是怪癖模式。解决这个问题将解决您的问题。
如果出现此问题,您可以通过确保HTML代码有效来解决此问题。最常见的原因是您尚未指定DOCTYPE,但问题中的代码也缺少<html>
标记和整个<head>
部分以及DOCTYPE。您需要添加所有这些以使其重视HTML并使其正确呈现。