積層問題はjQueryアコーディオンおよびIE7

Question

私は不思議な問題のjQueryプラグインのアコーディオンIE7(かげだ試にあります。を使ったこだわりカスタマイズjQuery UIのテーマを構築ThemeRoller.私調整であ調整色、マージンは、国境を越えたのアコーディオンにあるDIVでは、の子が私の主な内容です。簡易ネットワークへの展開やCSSを行っています。基本的には、コンテンツが中心のボックスに囲まれた国境を越えたメニューのオフセット下のボックス浮上を左端にする

問題なのはIE7またマウスをのせるとメニューの境界から main DIVを通じてアコーディオン。そのようなことはなにFFまたはサファリがあります。なぜ、デフォルトのアコーディオンCSSセットz-indexの1?ないすべての要素を表示上のDOM要素の背後ですか。理由のみに推移?

しかし、私はこの問題を解決ありますが、溶液としています。

<div id="main" style="position: relative;">
    <div id="main-menu">
        <ul id="navigation" class="ui-accordion">
            <li>
                <div class="ui-accordion-header">
                </div>
                <div class="ui-accordion-content">
                </div>
            </li>
        </ul>
    </div>
</div>

CSS

#main
{
    clear: both;
    padding: 30px 30px 30px 30px;
    background-color: #fff;
    border: solid 1px #669933;
    margin-bottom: 30px;
    min-height: 500px;
    height: auto !important;
    height: 500px;
    _height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
}
#main-menu
{
    position: absolute;
    top: 1em;
    left: -1em;
}

#navigation
{
    width: 10em;
}

/*UI accordion*/
.ui-accordion {
    /*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.5; text-decoration: none; font-size: 100%; list-style: none;
    font-family: Verdana, Arial, sans-serif;
    font-size: 1.1em;
/* additions from default */
    background-color: #ffffff;
    color: #333333;
    border: solid 1px #336600;
    text-indent: 0.2em;
    z-index: 1;
}

Answer 1

るようにして、明示的に設定z-indexをございます。ui-アコーディオンクラスったバックアップなります。ここで示されているデータの設定z-index(1)の main-menu DIV問題を解決し、IE7.ことに注意z-indexの主なものです。ui-アコーディオンクラスもあります。のui-アコーディオンクラスの main-menu divのレイアウトやきっかけになるかもしれないともたやすく簡単に追加のz-indexのメインメニューもよくrestyleでの作ui-アコーディオンクラスの適用されます。