probleme de transparence sur des div

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : probleme de transparence sur des div

Re: probleme de transparence sur des div

par niuxe » 18 janv. 2014, 00:24

Salut,

Le comportement est normal puisque #masqueHBox a une opacité de 0 par exemple alors son enfant aura la même chose. Pour remédier à cela, il faut que les deux éléments soient frères. Le soucis, s'ils sont frères, ils seront disposés l'un en dessous de l'autre. La solution est qu'il faille englober ces deux éléments frères en position relative et les deux frères seront en position absolute avec un z-index à déterminer pour chacun d'eux. ;)

probleme de transparence sur des div

par xavlille » 16 janv. 2014, 11:19

Bonjour
J'ai encore un problème ;p

Lorsque je click sur l'image, ma div masqueHBox apparait en transparence.
Mon souci c'est la div infoHBox elle aussi est en transparence je la voudrais 100% opaque.

après plusieurs recherche et essai de code je n'y parviens toujours pas
un coup de main me ferais bien plaisir

Merci à tous

voici le code /

<style type="text/css">

#masqueHBox {
position: fixed;
display: none;/*none block*/
width: 100%;
height: 100%;
background-color: #093;
color: #fff;
top: 0px;
left: 0px;
z-index: 50;
}

#infoHBox {
position: relative;
margin: auto;
margin-top: 100px;
width: 280px;
height: 200px;
color: #000;
font-size: 13px;
text-align: center;
border: thin double #00B259;
background-color: #FFF;
}

body {
background-color: #8B9C98;
}

</style>

</head>
<body>
<div id="masqueHBox" >
<div id="infoHBox" >
<p>Info</p>
</div>
</div>
<div id="HBox" >
<img src="image.jpg" width="160" height="160" />
</div>
</body>
</html>