0

私は Web サイトで作業していますが、#nav-wrapper に関する 1 つの問題を除いて、すべて問題ないようです。IE では、右端までです。とは言っても、それは右にフロートされますが、設定された幅である #nav-wrapper の右にフロートされ、設定された幅であるヘッダーに配置されます。ですから、なぜ右に曲がっているのかわかりません。ワードプレスのサイトなのでメニューやバナーなどを簡略化したサイトです。 

<div id="header-wrapper">
<header>
       <div id="nav-wrapper">
       <span class="nav-swirl-top">The Stuffed Pepper, Summerland BC</span>
        <nav id="access" role="navigation">
            MENU LIST
        </nav><!-- #access -->


           <div id="nav-updates">
        <p>Updates</p>
        </div>


            <span class="nav-swirl-bottom">The Stuffed Pepper</span>            
    </div><!-- #nav-wrapper -->


    <div id="banner">
       <img src="http://www.mysite.com/img/banner1.png" alt="Banner 1">'
    </div>

</header>
</div>

<div id="main">
<div id="container">


#header-wrapper { width: 100%; height: 532px; background: url(img/header-bg.jpg) repeat-x;}
header { clear: both; height: 620px; width: 900px;}
#banner { position: absolute; top: 230px; width:700px; left: 50%; margin-left: -470px; z-index: 1; }
#nav-wrapper { position: relative; clear: both; width: 252px; height: 365px; padding: 10px; float: right; margin-top: 230px;background-color: #650908; border: 1px solid #470604;}
#container { clear: both; background: url(img/container-bg.jpg) repeat; border-bottom: 3px solid #9d1316; color: #ccc1a1; }

これがどのように見えるかです。 ここに画像の説明を入力

では、#header-wrapper の幅と高さを設定しているのに、その下にテストが表示されるのはなぜですか?? IE が何をするのが好きなのか、どのようにスタイルを無視することを選択するのかわからないだけです!

助けていただければ幸いです。

アップデート

ヘッダーが正しく閉じられていないと表示される理由がわかりません..

ここに画像の説明を入力

これが実際の外観です。あなたにとってはそのように</hgroup/>見えますが、私にとってはまったくそうではありません。

Firefox 開発者ツールを使用しても、正しく表示されます ここに画像の説明を入力

4

1 に答える 1

2

すべての HTML5 タグが機能するわけではなく、Internet Explorer、特に古いバージョンでサポートされているわけではありません。

この参照記事を参照してください。

IE で動作させるには、いくつかの方法があります。

また、IE の開発者ツールを使用してサイトを調べます。HTMLがheader正しく開閉されていないようです。見て：

ここに画像の説明を入力

于 2012-06-15T02:30:34.220 に答える