1

サイトのホームページの z-index 設定に問題があります。ドロップダウンの長いサブメニューを切り捨てています。ホームページでのみこれを行います。z-index は 9999 に設定されています。このテーマは Woo Themes の Scrollider と呼ばれています。サイトの URL は www.kuhnflyfish.com です。Chrome の開発者ツールの多くのものに z-index プロパティを追加しようとしました。ホームページを少し下にスクロールして、コンテンツ ラッパーがナビゲーションのすぐ下にくるようにすると、問題を簡単に確認できます。コンテンツ ラッパーに負の z-index 値を指定しようとしましたが、うまくいきませんでした。どんな提案でも大歓迎です。以下は、未編集の CSS です。

ul.nav ul {
  width: 11.089em;
  visibility: hidden;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 9999 !important;
  margin: 0;
}

前もって感謝します

4

1 に答える 1

0

解決策は、親コンテナーから定義を削除しz-indexて、子要素が重複する と同じスタック コンテキストにあるようにすること#wrapperです。

これをする：

  1. layout.cssの439 行目z-indexから削除.has-slider #content-top
  2. layout.cssの446 行目z-indexから削除.has-slider #header
  3. layout.cssの469 行目z-index: -1;に追加.has-slider #featured-wrap

これにより、両方の要素が同じスタック コンテキスト上にあるため、.sub-menu要素を#wrapperコンテナーの上にスタックできます。

z-index親に を設定すると、新しいスタッキング コンテキストが設定されることに注意してください。z-indexこの親内の子は、最初の親よりも高い値を含む親の兄弟のいずれよりも上に表示されることはありません。

分解された説明：

親-1 (z-index: 1;)
-> 子 (z-index: 999;) | Parent-1 は Parent-2 よりも低い z-index を持っているため、Parent-2 の下に表示されます。

親-2 (z-index: 2;)

于 2013-03-25T21:04:06.947 に答える