HTML - Css：z-indexが相対位置で機能しない

divが配置されている必要があることがわかりました。HTML - Css：z-indexが相対位置で機能しない

その後、私はそれが私の場合には動作しない理由を知っていない：

2つのdiv

html { 
 
    height: 100%; 
 
} 
 
body { 
 
    position: absolute; 
 
    top: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
} 
 
#signDiv { 
 
    position: relative; 
 
    z-index: -1; 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 
#infoDiv { 
 
    position: relative; 
 
    width: 100%; 
 
    height: 100%; 
 
    z-index: 10; 
 
}

<body> 
 
    <div id="signDiv"> 
 
    ... 
 
    </div> 
 

 
    <div id="infoDiv"> 
 
    ... 
 
    </div> 
 
</body>

は、解決策を重畳されていませんか？

があるため、HTMLでの要素の順序で、あなたは一種の右の要素の位置を宣言することでそのZ-indexプロパティキックを行いますことをしている非常に

出典

2016-08-17 zbeyens

'Z-index'は順番を積み重ねるposition..it変更は変更されません。 –

をいただき、ありがとうございます。しかし、あなたの例では、 infoDivはすでにz-indexの点ではデフォルトで最上位に位置しています。あなたはz-indexも必要ありません。あなたが必要なもの

はabsolute代わりのrelativeに自分の位置を設定することです。そのような

何か：http://codepen.io/memoblue/pen/xOBBxK

出典

2016-08-18 02:15:08 memo

html { 
 
    height: 100%; 
 
} 
 
body { 
 
    margin: 0px; 
 
    padding: 0px; 
 
} 
 
#signDiv { 
 
    position: absolute; 
 
    z-index: -1; 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 
#infoDiv { 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 100%; 
 
    z-index: 10; 
 
}

<body> 
 
    <div id="signDiv"> 
 
    ...1 
 
    </div> 
 

 
    <div id="infoDiv"> 
 
    ...2 
 
    </div> 
 
</body>

出典

2016-08-18 06:25:09 2PM

HTML - Css：z-indexが相対位置で機能しない

答えて

関連する問題