IE8不能正确显示定位div
问题描述:
我在IE8中只有布局时遇到了一些麻烦。我有一个很大的背景图片。然后,我希望我的标题详细信息位于此之上。我用z-index的绝对定位使它坐在最上面。所有其他浏览器都很完美,只有IE8给我带来了问题。它将我的标题放置在大图像下面。IE8不能正确显示定位div
这里是我的代码
<div id="homepage-banner">
<img class="home-carousel" src="images/banner.jpg" />
</div>
<header>
<div id="logo">
<img src="images/logo.png" />
</div>
<div id="header-text">
<p><span style="font-weight:bold; color: white">></span> Call us now on <strong>0800 785 7348</strong></p>
<p><span style="font-weight:bold; color: white">></span> <a href="#" style="font-weight: bold; text-decoration: none; color: black">Click here</a> to enquire online</p>
</div>
<div id="nav-bar">
<img src="images/nav.png" width="980" height="45"/>
</div>
</header> <!-- header -->
我的CSS
header {
height: 120px;
width: 980px;
z-index: 1000;
position: absolute;
top: 25px; }
#homepage-banner {
height: 555px;
width: 3000px;
margin-left: -1000px;
margin-bottom: -210px;
background-color: rgb(0,173,239); }
我怎样才能改变我的代码,以便IE8显示在图像的顶部我的头?
答
我假设您没有包含shiv脚本,因为z-index在IE 8中受支持。因为您使用HTML 5 <header>
元素而不包括html5shiv脚本,因此IE无法正确解析您的标头,导致你描述的行为。只要按照我提供的链接,并在您<head>
该脚本,你将有新的HTML 5元素的支持..
放在一个条件注释中的<head>
<!--[if lt IE 9]>
<script src="dist/html5shiv.js"></script>
<![endif]-->
你有包括[html5shiv的.js](https://code.google.com/p/html5shiv/)? – vcampitelli 2013-03-12 20:13:34