CSSの修正方法を教えて下さい｡ http://www.houbou-ya-phuket.com/tour/islandsafari/index.html 上記､ﾍﾟｰｼﾞですが､ｽﾗｲﾀﾞｰ下部のﾒｲﾝﾒﾆｭｰにｶｰｿﾙを合わせ…

人力検索はてな

ﾓﾊﾞｲﾙ版を表示しています｡PC版はこちら

CSSの修正方法を教えて下さい｡

http://www.houbou-ya-phuket.com/tour/islandsafari/index.html

上記､ﾍﾟｰｼﾞですが､ｽﾗｲﾀﾞｰ下部のﾒｲﾝﾒﾆｭｰにｶｰｿﾙを合わせて､ﾒﾆｭｰを展開すると､ﾒﾆｭｰの下部にある要素の下に､ﾒﾆｭｰが入ってしまい見えなくなってしまいます｡

どのようにCSSを修正すれば良いでしょうか？

●質問者: Tomo
●ｶﾃｺﾞﾘ:ｳｪﾌﾞ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

▽1 ● a-kuma3
●200ﾎﾟｲﾝﾄ

ﾍﾞｽﾄｱﾝｻｰ

p7TP3-05.css に書かれている z-index: 10; を無効にするか､

.p7TP3-05 .p7TP3tabs_05 {
 position: relative;
 /* z-index: 10; これを無効にする */
 overflow: hidden;
 zoom: 1;
 border-top: 1px solid #9CBCBC;
 border-right: 1px solid #9CBCBC;
 border-left: 1px solid #9CBCBC;
}

link ﾀｸﾞで p7TP3-05.css を読み込んでいる所よりも後の方で､以下のｽﾀｲﾙを指定｡

.p7TP3-05 .p7TP3tabs_05 {
 z-index: 0;
}

ﾒﾆｭｰの方で z-index を増やしても同じだと思うのですが､何故かうまくいきません (´･ω･｀)

rouge_2008さんのｺﾒﾝﾄ
私もさっき知りましたが､こういう事らしいです｡･ - CSS | MDN https://developer.mozilla.org/ja/docs/Web/CSS/z-index >> 値 auto ﾎﾞｯｸｽはﾛｰｶﾙなｽﾀｯｸ文脈を新たに作りません｡現在のｽﾀｯｸ文脈で作られたﾎﾞｯｸｽは､親ﾎﾞｯｸｽと同じｽﾀｯｸﾚﾍﾞﾙを持ちます｡ <integer> この整数値は､現在のｽﾀｯｸ文脈で作られたﾎﾞｯｸｽのｽﾀｯｸﾚﾍﾞﾙです｡ﾎﾞｯｸｽはｽﾀｯｸﾚﾍﾞﾙ 0 のﾛｰｶﾙのｽﾀｯｸ文脈を作ります｡これは､子孫要素の z-index は､この要素の外部にある要素の z-index とは比較されないということです｡ << なので､共通の親要素のﾚﾍﾞﾙをあげる(※質問のｹｰｽでは11以上にする)と解決します｡

rouge_2008さんのｺﾒﾝﾄ
解決方法間違っていたので訂正します｡ﾒﾆｭｰの方を変更する場合は以下で大丈夫だと思います｡ <del>なので､共通の親要素のﾚﾍﾞﾙをあげる(※質問のｹｰｽでは11以上にする)と解決します｡</del> ﾒﾆｭｰの親要素(｢.menutop-wrapper｣)のﾚﾍﾞﾙをあげる(※質問のｹｰｽでは11以上にする)かあるいは｢z-index｣指定を削除すると解決します｡