[CSS] Menu : superposition

Bonjour à tous,
Alors voila je réalise un menu en CSS/Javascript. Tout se passe pas mal sauf un point : le sous menu déroulant est en dessous d'un .swf. J'aimerai le passer au dessus afin que le sous menu devienne lisible. Je me doute qu'il doit falloir travailler autour des z-index mais comme j'ai pas bien compris comment cela fonctionnait je suis un peu au dépourvu.
Le pb :

http://jibees.free.fr/BO/pb_1.jpg

Le code CSS :

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 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57

dl, dt, dd, ul, li { margin: 0; padding: 0; list-style-type: none; } #menu { position: relative; z-index:1; width: 100%; top: 0px; left: 6px; } #menu dl { float: left; margin: 0px; } #menu dt { cursor: pointer; z-index:1; position: relative; } #menu dd { border: 1px solid #00308F; width: auto; display: none; z-index:1; position: absolute; background: #B90105; } #menu li { text-align: left; background: #F6F7F7; z-index:2; }   #menu dt a { display: block; border: 0 none; z-index:2; }   #menu li a:hover, #menu dt a:hover {   }   a { font-size: 10px; font-family: "Arial"; text-decoration: none; color: #B90105e; }   a:hover { text-decoration: none; color: #FFAA32; font-style: italic; }

---

Le flash qui pose pb :

Code:

---

<embed width="100" height="100" src="images/Partenaires.swf">

---

Salut

Le bloc dont le z-index est le plus élevé se trouvera au premier plan.

Dans ton cas je suppose que se sont les bloc <dd> qui passent sous le flash ?
Il faudra alors leur attribuer un z-index supérieur au z-index du flash.
Par exemple :

Code:

---

1 2 3 4

#menu dd { .. z-index: 10; ..}

---

Code:

---

<embed style="z-index: 0" width="100" height="100" src="images/Partenaires.swf">

---

edit : J'ai un doute... avec la particularité du flash. Si la méthode si dessus ne fonctionne pas, ajoute ce paramètre entre les balises object

Code:

---

1 2 3 4 5

<object type="application/x-shockwave-flash" data="images/Partenaires.swf" width="100" height="100">   <param name="wmode" value="transparent"> </object>

---

rien de tout cela ne fonctionne malheureusement. il semblerait que cela soit du à la spécificité du flash ...

flash se place toujours au dessus du reste.
Il faut descendre le z-index de ton flash (avec une class ou id par ex)
et le mettre en position absolute (ou/et monter le z-index du menu)
(On ne peut changer un z-index que en position absolute)

alors la j'ai pas tout compris ...
Est-ce que cela doit donner un truc comme ca :

Code:

---

<p align="center" id="flash" > <embed width="100" height="100" src="images/Partenaires.swf"></p>

---

et le css :

Code:

---

1 2 3 4

flash{ z-index: 100; position: absolute; }

---

plutôt

Code:

---

1 2 3 4 5 6 7 8 9

<div id="flash"> <object type="application/x-shockwave-flash" data="fichier.swf" height="..." width="..."> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="fichier.swf" /> <param name="menu" value="false" /> <param name="quality" value="high" /> <param name="wmode" value="transparent" /> </object> </div>

---

et

Code:

---

1 2 3 4 5

#flash{ position:absolute; z-index:0; ... }

---

c parfait merci !