私は数時間、IE7の敵でCSS z-indexと戦ってきました、多分あなたは助けることができます!
私は絶対に配置されたdivを持っており、その親divの上に表示されます。これは素晴らしいことです。ただし、親の兄弟である後のdivの下に表示されます。
z-indexが各divなどのローカルスコープにのみ適用されるように、これは非常に奇妙な動作のように見えます。
ページ上の他のどの要素よりも大きいz-indexを持つように要素を設定すると、それが関係なく一番上に表示されるように設定するにはどうすればよいですか?
これが私のテストページです:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>test</title>
</head>
<body>
<div style="position: relative; z-index: 0">
div1
<div style="position: relative; z-index: 0">
div2
</div>
<div style="color: red; background-color: #ffffff; position: absolute; z-index: 2">
div3
</div>
</div>
<div style="position: relative; z-index: 0">
div1
<div style="position: relative; z-index: 0">
div2
</div>
<div style="color: red; background-color: #ffffff; position: absolute; z-index: 2">
div3
</div>
</div>
<div style="position: relative; z-index: 0">
div1
<div style="position: relative; z-index: 0">
div2
</div>
<div style="color: red; background-color: #ffffff; position: absolute; z-index: 2">
div3
</div>
</div>
</body>
</html>