Internet explorer z-index auto
Bonjour
J'aimerai d'abord savoir si IE 6,7 gère le z-index auto ?
Je rencontre de gros prroblème à cause du "contexte d'empilement".
Un exemple simple:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>z-index</title>
<style type="text/css">
#alphabet { position: relative; z-index: 1; }
#a,
#b,
#c,
#d,
#e,
#f { position: absolute; height: 300px; width: 300px; }
#aa, #ab,
#ba,
#ca,
#da,
#ea,
#fa { position: absolute; height: 100px; width: 100px; }
#a { left: 236px; background: #990000; z-index: auto; }
#aa { left: 189px; top: 20px; background: #CC6633; z-index: 50; }
#ab { left: 24px; top: 37px; background: #CC0000; z-index: 70; }
#b { background: #FF00FF; left: 1px; top: 9px; z-index: 2; }
#c { background: #00FFFF; left: 11px; top: 39px; z-index: 3; }
#d { background: #0000FF; left: 214px; top: 87px; z-index: 4; }
</style>
</head>
<body>
<div id="alphabet">
<div id="a">Placez ici le contenu de id "a"
<div id="aa">Placez ici le contenu de id "aa"</div>
<div id="ab">Placez ici le contenu de id "ab"</div>
</div>
<div id="b">Placez ici le contenu de id "b"</div>
<div id="c">Placez ici le contenu de id "c"</div>
<div id="d">Placez ici le contenu de id "d"</div>
</div>
</body>
</html> |
Sous Firefox, #aa et #ab passent au dessus de tous les blocs.
Sous IE 6, 7 #aa et #ab ne passent pas au dessus de ces blocs.
Connaissez-vous un moyen d'obtenir le même résultat sur ces 3 navigateurs ?
Merci
