28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous ,
j'essaie depuis un petit moment de faire afficher un claque par dessus une partie de mon site mais sans grand succès.
D'après ce que j'ai pu lire ce sont les z-index qui permettent celà. Un zindex élevé placera le calque en haut des autres.
Mon but est de faire apparaitre un claque au clic d'un lien :

<div class="corps">
		<div class="top">
			<div class="log_membre">
					<div class="espace_membre_log_yes">
					<a href="#" onclick="Element.setStyle('memberplus', {display:'block'} );">Click me</a></div>
					</div>
			</div>
			<div class="pub1"></div>	
		</div>
		<div id="memberplus" class="memberplus"> Oulalala salut <br /> pwet pwet</div>
		<div class="middle" style="z-index:1;">
		<!--BLOC qui devrait être recouvert-->
		</div>


Le css du claque :
		 .memberplus
		 {
			border:1px solid #000
			background-color:#fff;
			color:red;
			z-index:10;
			display:none;
			height:150px;
			width:200px;
		}


J'ai essaye en appliquant un z-index 1 au conteneur global de mon site mais également sans autre z-index de précisé. A chaque fois que je clic sur mon lien mon calque apparait bien mais décale tout le design , il ne se place donc pas au dessus des autres malgré le z-index.

Y'a t'il une étape que j'ai omise ?
Modifié par GrUnK (07 Sep 2007 - 12:50)
a écrit :
Y'a t'il une étape que j'ai omise ?
Oui un déclaration plus exactement Smiley cligne
la propriété z-index ne peut s'appliquer qu'à des éléments positionnés (absolue, fixed ou relative) donc dans ton cas tu dois ajouter
position:absolute

et éventuellement les propriétés de positionnement adéquates (top, right, left et bottom) sachant que ne rien mettre à ce niveau en position absolue permet de conserver l'élément à son emplacement dans le flux du code.
Modifié par Hermann (07 Sep 2007 - 12:33)