28172 sujets

CSS et mise en forme, CSS3

Bonjour a tous,

Voila je retravaille le design d mon shop.
Dans ce redesign, j'ai developper un panier déroulant.

Apres de multiple teste sous plein de nav différents je me rend compte entre autre, que ie7, ne prend pas en compte mon z-index

<div id="liv_classif">
  <a href="/fr/freedeliver.php" rel="nofollow" class="gras font18">Livraison gratuite</a><span class="gras font16"> dès 60&euro;</span><br/><a href="/fr/paiement.php" class="font12" rel="nofollow">Paiement sécurisé <img src="images/carte.gif" width="74" height="15" alt="Paiement sécurisé" /></a> 
</div>
//plusbas dans le code:
<div id="full_panier">asdasd</div>


#full_panier {
position:relative;
 style="display: none;
 z-index:10;"
}

#liv_classif {
position: absolute;
right:10px;
top: 90px;
width: 258px;
text-align: right;
padding-left: 5px;
padding-top: 5px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
 z-index: 4;
}


Les deux élément sont positionner, z-index de full_panier > z-index de liv_classif
Pourtant le liv_classif passe par dessus.
Sachant que sous ff3,ff4,ie8,safari,opera, pas de souci?

Aurais je fais une erreur?
Bonjour,

Le problème pourrait venir de
style="display: none; 


Sinon, et c'est tout aussi probable, il faudra te renseigner sur le "contexte de formatage".
merci pour ta réponse.

effectivement en supprimant le display, le problème disparait, cependant.
Ceci étant un menu qui est doit être caché et se dérouler au survol par js, et ne pas apparaitre si js est desactivé, j'avais choisit c'est solution.

Comment pourrais je faire en sort que si le js est désactivé la div n'apparaisse pas sans utilisé
style="display: none; 
?

Sinon j'ai passé ma div #liv_classif en z-index:-1 ca fonctionne aussi. mais je suppose que c'est pas propre
Euh...

Le problème c'est que l'instruction n'est pas correcte.

Le style=" c'est du copier collé depuis l'HTML et pas du tout valide en CSS...
oupss..

C'est un problème de recopiage sur le forum, mais mon css est:
position:relative; 
display: none; 
 z-index:10;" 



Néanmoins si je supprime le display:none; la div passe bien au dessus.
Il existe un bug sous IE7 avec les z-index. Il faut que tu définisses un z-index plus élevé que celui de #full_panier et #liv_classif au conteneur parent de ces deux derniers.

Exemple 1
Exemple 2