0

IE7のCSSz-indexに問題があり、その問題を解決できないようです。

#screen {
    display: none;
    background-image: url('/images/bg.png');
    background-repeat: repeat;
    position: fixed;
    top: 0px;
    left: 0px;
    min-width: 100%;
    min-height: 100%;
    z-index: 10000;
}

<div id="screen"></div>

ページの読み込み時に表示されるオーバーレイがありますr_box

<div id="r_box">
    <div id="message_panel">
        ...Content in here...
    </div>
</div>

#r_box
{
    width: 335px;
    height: 337px;
    background: url("/images/panel.png") no-repeat scroll 0 0 transparent;
    position: fixed;
    margin-left: -150px;
    margin-top: -130px;
    left: 50%;
    top: 50%;
    z-index: 10001;
    display: none;
}

#r_box #message_panel {     
    color: #fff;
    z-index: 10001;
    bottom: 95px;
}

ただし、IE7でのみ発生している問題は、ページの読み込み時にscreendivが常に上にあることr_boxです。私はこれをIE8、IE9、FF、Safari、Chromeでテストしましたが、これらすべてのブラウザーで動作します。それが問題となるのはInternetExplorer7だけです。

screenこれは、またはDIVの問題である可能性が高いですか、それとも他の問題である可能性がありr_boxますか？

4

1 に答える 1

0

This boiled down to a stacking context issue that was only apparent, as many have found, with Internet Explorer 7.

I decided to remove the problematic behaviour for IE7 only, as i'm a believer that an application does not need to look the same in every browser.

于 2012-08-29T10:19:42.377 に答える