Problème de priorité de div
Résolu
Truffe2004
Messages postés
8
Date d'inscription
Statut
Membre
Dernière intervention
-
Truffe2004 Messages postés 8 Date d'inscription Statut Membre Dernière intervention -
Truffe2004 Messages postés 8 Date d'inscription Statut Membre Dernière intervention -
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
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
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
A voir également:
- Problème de priorité de div
- Div c++ - Télécharger - Langages
- Remplacer #div/0 par vide - Forum Excel
- Enlever les #DIV/0! dans une colonne calcul d'un tableau croisé ✓ - Forum Excel
- Paypal utiliser le solde en priorité - Forum Consommation & Internet
- Remplacer #div0 par le chiffre 0 - Forum Bureautique
2 réponses
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.
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.
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
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
