IE7 でコンテキスト メニューがボタンの後ろに表示されるのはなぜですか?

コンテキスト メニューの IE7 Z-Index の問題

問題ステートメント:

IE7 では、コンテキスト メニュー (ul) が、関連付けられているボタンの下に表示され、メニューが非表示になります。この動作は、ブラウザーのスタックコンテキストの独自の処理により、他のブラウザーとは異なります。

分析:

ボタンとメニューに使用される CSS は、相対およびメニューを使用してこれらの要素を配置します。それぞれ絶対位置。ただし、IE7 では、最も近い位置にある祖先 (この場合は「control-action」 div) がスタッキング コンテキストを決定します。これは、メニューの Z インデックス (10000) が考慮されず、メニューがボタンの下に配置されることを意味します。

解決策:

この問題を解決するには、HTML 要素の順序は次のように変更できます。

<div class="control-action">
  <ul>

ul の後にボタンを配置することで、ボタンは最も近い位置にある祖先となり、新しいスタッキング コンテキストを確立します。これにより、メニューの z-index (10000) が有効になり、ボタンの上にメニューが表示されるようになります。

以上がIE7 でコンテキスト メニューがボタンの後ろに表示されるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。