0

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 が画像の上にヘッダーを表示するようにコードを変更するにはどうすればよいですか?

4

1 に答える 1

2

z-index は IE 8 でサポートされているため、shiv スクリプトが含まれていないと想定しています。html5shiv<header>スクリプトを含めずに HTML 5 要素を使用しているため、IE はヘッダーを適切に解析できず、動作につながりますあなたが説明します。私が提供したリンクをたどって、そのスクリプトをあなたに含めるだけで、新しい HTML 5 要素をサポートできます..<head>

あなたの内の条件付きコメントに入れてください<head>

<!--[if lt IE 9]>
 <script src="dist/html5shiv.js"></script>
<![endif]-->
于 2013-03-12T20:17:02.423 に答える