IE8 无法正确显示定位的 div答案

【问题标题】：IE8 not displaying positioned div correctlyIE8 无法正确显示定位的 div
【发布时间】：2013-03-13 04:41:17
【问题描述】：

我只在 IE8 中的布局有一些问题。我有一个大的背景图像，这很好。然后我希望我的标题详细信息位于此之上。我使用绝对定位和 z-index 让它位于顶部。所有其他浏览器都很完美，只有 IE8 给我带来了问题。它将我的标题定位在大图像下方。

这是我的代码

<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 在图像顶部显示我的标题？

【问题讨论】：

你是否加入了html5shiv.js？

标签： css internet-explorer-8 z-index

【解决方案1】：

我假设您没有包含 shiv 脚本，因为 IE 8 支持 z-index。因为您使用的是 HTML 5 <header> 元素而不包含 html5shiv 脚本，所以 IE 无法解析您的标题正确，导致您描述的行为。只需按照我提供的链接并将该脚本包含在您的 <head> 中，您将获得对新 HTML 5 元素的支持..

将其放在您的<head> 中的条件注释中

<!--[if lt IE 9]>
 <script src="dist/html5shiv.js"></script>
<![endif]-->

【讨论】：