Discussion :

[cell]

bonjour,
voila j'ai un menu déroulant suivi d'un balise div ou seront affiché les pages du menu
donc jusque la ca fonctionne pour l'affichage
mon problème est que lorsque je déroule un de mes menu cela s'affiche derrière la div plutot que devant.
Comment faire pour que ce soit l'inverse?
voici mon code de ma feuille de style

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<style type="text/css">
                        #menu{
                                margin-left:100px;
                        }
                        dl, dt, dd, ul, li {
                                margin: 0;
                                padding: 0;
                                list-style-type: none;
                        }
                        #menu dl {
                                float: left;
                                width: 12em;
                                border-right:1px solid #fff;
                                border-left:1px solid #fff;
                                margin:.2em;
                                padding:.1em;
                        }
                        #menu dt {
                                text-align: center;
                                color:#FFF;
                                background-color:#036;
                                font:normal 90% arial, helvetica, sans-serif;
                        }
                        #menu dd {
                                border-top: 1px solid #FFF;
                        }
                        #menu li {
                                text-align: center;
                                background: #036;
                                font:normal 90% arial, helvetica, sans-serif;
                                color:#FFF;
                        }
                        #menu li a, #menu dt a {
                                color: #FFF;
                                text-decoration: none;
                                display: block;
                                height: 100%;
                        }
                        #menu li a:hover, #menu dt a:hover {
                                background-color: #369;
                                color:#FFF;
                        }
                        body {
                                font-family:"palatino linotype";
                                background-color: #003366;
                        }
                        #entete {
                                background-color: #FFFFFF;
                                margin-left:100px;
                                width: 800px;
                                height:70px;
                                topmargin:0px;
                                color: #003366;
                                font-size: 16px;
                        }
                        p.titre {
                                font-size:30px;
                                color: #003366;
                                font-weight:bold;
                        }
                        #corps {
                                height: 467px;
                                width: 800px;
                                margin-left:100px;
                                position: absolute;
                                top : 110px;
                                left : 10px;
                        }
                </style>

et voici le code mon menu suivi de la balise div

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
42
43
44
45
<div id="menu" align="center">
			<dl>
				<dt onmouseover="javascript:montre();"><a href="?p=AccueilOperateur" title="Retour à l'accueil">Accueil</a></dt>
			</dl>
			<dl>
				<dt onmouseover="javascript:montre('smenu1');">Valeur d'un indicateur</dt>
					<dd id="smenu1">
						<ul>
							<li><a href="?p=Ajout/AjoutValeur">Ajouter</a></li>
							<li><a href="?p=Modification/ModifValeur">Modifier</a></li>
							<li><a href="?p=Suppression/SupValeur">Supprimer</a></li>
						</ul>
					</dd>
			</dl>
			<dl>
				<dt onmouseover="javascript:montre('smenu2');">Une &eacute;tape</dt>
					<dd id="smenu2">
						<ul>
							<li><a href="?p=Ajout/AjoutEtape">Ajouter</a></li>
							<li><a href="?p=Modification/ModifEtape">Modifier</a></li>
							<li><a href="?p=Suppression/SupEtape">Supprimer</a></li>
						</ul>
					</dd>
			</dl>
			<dl>
				<dt onmouseover="javascript:montre('smenu3');">Une action simple</dt>
					<dd id="smenu3">
						<ul>
							<li><a href="?p=Ajout/AjoutAS">Ajouter</a></li>
							<li><a href="?p=Modification/ModifAS">Modifier</a></li>
							<li><a href="?p=Suppression/SupAS">Supprimer</a></li>
						</ul>
					</dd>
			</dl>
		</div>
		<br>
		<!-- cadre du contenu -->
		<div id="corps">
			<?php
                                if (isset($_REQUEST["p"]) AND file_exists($_REQUEST["p"].".php")){
                                include($_REQUEST["p"].".php");
                            }else
                                        include("AccueilOperateur.php");
                        ?>
		</div>

[Etanne]

Je pense que cela peut t'aider :
http://www.google.fr/search?hl=fr&q=z-index+css&meta=

[cell]

merci ct ca
donc voici mon nouveau code pour la feuille de style

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<style type="text/css">
                        #menu{
                                margin-left:100px;
                                position:absolute;
                                z-index:100;
                        }
                        dl, dt, dd, ul, li {
                                margin: 0;
                                padding: 0;
                                list-style-type: none;
                        }
                        #menu dl {
                                float: left;
                                width: 12em;
                                border-right:1px solid #fff;
                                border-left:1px solid #fff;
                                margin:.2em;
                                padding:.1em;
                        }
                        #menu dt {
                                text-align: center;
                                color:#FFF;
                                background-color:#036;
                                font:normal 90% arial, helvetica, sans-serif;
                        }
                        #menu dd {
                                border-top: 1px solid #FFF;
                        }
                        #menu li {
                                text-align: center;
                                background: #036;
                                font:normal 90% arial, helvetica, sans-serif;
                                color:#FFF;
                        }
                        #menu li a, #menu dt a {
                                color: #FFF;
                                text-decoration: none;
                                display: block;
                                height: 100%;
                        }
                        #menu li a:hover, #menu dt a:hover {
                                background-color: #369;
                                color:#FFF;
                        }
                        body {
                                font-family:"palatino linotype";
                                background-color: #003366;
                        }
                        #entete {
                                background-color: #FFFFFF;
                                margin-left:100px;
                                width: 800px;
                                height:70px;
                                topmargin:0px;
                                color: #003366;
                                font-size: 16px;
                        }
                        p.titre {
                                font-size:30px;
                                color: #003366;
                                font-weight:bold;
                        }
                        #corps {
                                height: 467px;
                                width: 800px;
                                margin-left:100px;
                                position: absolute;
                                top : 110px;
                                left : 10px;
                                z-index:1;
                        }
                </style>