Problème de priorité de div

Résolu/Fermé
Truffe2004 Messages postés 8 Date d'inscription mercredi 31 mars 2004 Statut Membre Dernière intervention 13 décembre 2010 - 13 déc. 2010 à 01:02
Truffe2004 Messages postés 8 Date d'inscription mercredi 31 mars 2004 Statut Membre Dernière intervention 13 décembre 2010 - 13 déc. 2010 à 14:05
Bonjour,

J'ai un site développé sur wordpress 3.0.3 qui tourne sur Apache sur un serveur ubuntu à jour.

https://www.dreamphotos-studio.com/

J'ai un problème sur les pages du portfolio avec presque tous les navigateurs sauf Firefox.

Le menu en haut de la page passe derrière l'application flash qui permet d'afficher mes photos ... sauf sous firefox où il reste bien devant.

J'ai vérifié sur http://jigsaw.w3.org/css-validator/ et mon CSS n'a pas d'erreur ... idem pour ma page qui n'a pas d'erreur majeur.

voici comment sont fait les div de la page avec leur positionnement et leur niveau z-index

   <body>
      <div id="page">                                   [z-index: 1;   position: relative;]
         <div id="header">                             [z-index: 80;  position: relative;]
            <div id="navbar">                          [z-index: 300; position: relative;]
               Le menu se trouve ici. c'est un simple <ul></ul>
            </div><!-- navbar -->
         </div><!-- header -->
         
         <div id="content" >                                    [z-index: 10;  position: relative;]
            <div id="contenu" >                                [z-index: 20;  position: relative;]
               <div id="PortfolioDroite">                     [z-index: 30;]
                  <div id="flashgal">                            [z-index: 40;   position:relative;]
                      l'application flash se trouve ici ..
                  </div><!-- flashgal -->
               </div><!-- PortfolioDroite ->
            </div><!-- Contenu -->
         </div><!-- content -->
[...]


On voit que le menu est dans la div avec le plus haut niveau z-index ... je ne comprends pas pourquoi, hors mis sous firefox, ça ne fonctionnement pas.

La div "page" contient toute la page
La div "header" contient l'entête de la page avec le menu
La div "content" contient le centre de la page dont l'application flash...


Merci
Benoit

2 réponses

kiyomasa Messages postés 312 Date d'inscription mercredi 23 septembre 2009 Statut Membre Dernière intervention 12 mai 2016 5
13 déc. 2010 à 13:14
j'ai pas regardé ton code plus que ça mais en général, le Flash se charge au-dessus de tout autre élément.

De ce que j'ai lu sur d'autre post, c'est qu'il faut ajouté la propriété "transparent" au flash.

En gros ça enlève le fond de ton flash mais surtout apparament cela permet de le faire passé en dessous d'autre éléments.

<param name="wmode" value="transparent" />

tu peux enlever les Z-index du coup, cela n'est plus nécessaire.

En général, en procédant ainsi, moi, j'ai pas de soucis.
0
Truffe2004 Messages postés 8 Date d'inscription mercredi 31 mars 2004 Statut Membre Dernière intervention 13 décembre 2010
13 déc. 2010 à 14:05
Merci beaucoup kiyomasa pour ta réponse.
Cela permet de résoudre effectivement le problème mais par contre seulement sur Internet explorer.

Du coup je l'ai aussi ajouté dans le paramètre "embed" sous le fomat (WMODE="transparent") et là ça fonctionne aussi sur "Google Chrome", "Safari", "flock" et opéra.

Un grand merci kiyomasa
0