0

HTML とスタイルは次のようになります。

<style type="text/css">
    .header {
        position: fixed;
        top: 0;
        width: 100%;
        height: 50px;
        background: #AAA;
    }
    .menu {
        position: relative;
        float: right;
        margin-right: 100px;
    }

    ul {
        display: none;
        position: absolute;
        top: 100%;
        height: 50px;
        width: 100px;
        background: #CCC;
        color: #C00;
    }
    .menu:hover ul {
        display: block;
    }
</style>
<div class="header">
    <div class="menu">
        <a>HOVER~</a>
        <ul><li>SHOW ME!!</li></ul>
    </div>
</div>

ヘッダーは位置固定で、メニューは絶対位置です。単純なコードは私の IE8 でうまく機能します。しかし、メニューはオンライン バージョンでは見えません。メニューがオーバーフローして親によって隠されているように見えますが、そうであってはなりません。CSS ルールの切り替えまたは z-index の設定を試みましたが、まだ問題がわかりません。

4

1 に答える 1

0

私が見る限り、問題は投稿されたコードではありません。それをいじると、すべてが機能します（ieでも）。問題 (私は ie9 にもあります) は、クラスのスタイル ルールだと思います: .sub-header. これはあなたの元のコードです：

.sub-header {
    height: 32px;
    border-bottom: 1px solid #1B1B1B;
    background-color: #2B2B2B;
    background-image: -moz-linear-gradient(bottom,#3B3B3B 0,#2B2B2B 100%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0%,#3B3B3B),color-stop(100%,#2B2B2B));
    background-image: -webkit-linear-gradient(bottom,#3B3B3B 0,#2B2B2B 100%);
    background-image: -o-linear-gradient(bottom,#3B3B3B 0,#2B2B2B 100%);
    background-image: -ms-linear-gradient(bottom,#3B3B3B 0,#2B2B2B 100%);
    background-image: linear-gradient(bottom,#3B3B3B 0,#2B2B2B 100%);
    /* the following line should be removed, wrong syntax and causes height/display problems */
    *filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#FF3B3B3B,endcolorstr=#FF2B2B2B)url(0/);
    background: url(http://img.yesneaker.com/img/common/gray-stripe.png) #3B3B3B repeat;
    background: url(http://img.yesneaker.com/img/common/black-circle.png) #222 repeat fixed;
    background: url(http://img.yesneaker.com/img/common/header-bg.png) 50% 0 #2B2B2B repeat;
}

問題はフィルターです (最初に行末に誤りがあります - URL)。2 つ目は、グラデーション フィルターと要素の高さにいくつかの問題があります。削除してみて、機能するかどうかを確認してください。

于 2013-01-05T10:38:12.427 に答える