web-dev-qa-db-ja.com

他のすべてのコントロールの上にdivを作成する方法

100％の幅と高さを配置したすべての上にdivを表示し、CSSのz-indexやその他のものを除いて、多くのコントロールの上に表示したいと思います。 div z-indexを大きな数値に設定しようとしましたが、これは機能しませんでした。

{
    width: 100%;
    height: 100%;
    top: 5px;
    left: 0px;
    background-color: #FFFFFF !important;
    padding: 10px;
    overflow: hidden;
    visibility: visible;
    display: block;
    z-index: 500 !important;
    position: relative;
}
cssz-index
13
new

画面全体をカバーしたいので、これをお勧めします。

#overlayDiv {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index:99;
}

表示プロパティと表示プロパティを設定する必要はありません。また、この要素にパディングやマージンを設定しないでください！余白を付ける場合は、その子にマージンを設定します。

また、問題のDIVがBODY要素の直接の子であることを確認してください。

29
Šime Vidas
.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}
0
Muhammed Moussa

それは問題がselectsとIE6でのみ存在することでしょうか？もしそうなら、 ここで答え を見てください。

0
Daniel

要素が画面にレイアウトされる自然な流れからhtml要素を引き出すには、position：absoluteを使用する必要があります。これにより、要素が他の要素の上のレイヤーになることができます（Z-index値が他のすべての要素よりも大きいと仮定）。

現在、あなたの要素は相対的な位置を持っているようです。

0
cherouvim

おそらく、問題はposition:relativeに関連しています。代わりに絶対値に設定し、要素をオフセットする必要がある場合は、margin/topではなくleftを使用してください。

0
Arseni Mourzenko