28220 sujets

CSS et mise en forme, CSS3

Salut a toutes et à tous
Quelqu'un saurais t'il comment faire en sorte qu'un div adapte sa hauteur à la hauteur du parent ?
Je m'explique, j'ai un div qui encapsule 2 autres div
la hauteur du parent n'est pas fixée, la hauteur de l'enfant à droite varie en fonction du contenu et je voudrais que l'enfant gauche s'adapte egamelent.
(les enfants ont la propriete float positionnée sur left).
le but de la manoeuvre etant d'avair un liseret (image) en fond de l'enfant a droite du contenu.

d'avance merci de vos réponses ou d'un petit lien vers un post interessant sur ce sujet que j'aurais pu manquer.

cordialement,
David
Modifié par dgsconseil (22 Nov 2005 - 10:33)
bonsoir,

je pense que ce tutoriel devrait repondre à tes questions.

A la fin de ce tuto tu trouveras un lien vers les gabaris qui regroupent l'ensemble des possibilité

Amicalement,
merci du conseil
je vais voir avec le dernier lien qui me parait pas trop mal
mais j'ai l'impression qu'il joue aussi avec le fond de conteneur et c pas top....
bon j'ai résolu le problème d'une autre manière....
le code :

<div class="box">
        <div class="boxheader">
	 <BOXTITLE/>
        </div>
        <div class="boxcontent">
	  <div class="boxcontentcenter">
		<div class="boxcontentleft">
			<div class="boccontentright"><BOXCONTENT/></div>
		</div>	
	  </div>
        </div>
        <div class="boxcontentfooter"></div>
</div>

les styles

#left div.box{
	width: 220px;
	height:100%;
	margin: 0px 0px 0px 0px;
	margin-top:10px;
}


#left div.box div.boxheader {
	background: url(../images/leftbox_header.gif);
	height: 15px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	text-indent:6px;
	width: 220px;
	font: normal normal bold 8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: black;
}


#left div.box div.boxcontent {
	width: 220px;
	height:100%;
	background: url(../images/boxcontentright.gif) right repeat-y;	
}
#left div.box div.boxcontent div.boxcontentleft{
	width: 5px;
	height:100%;
	position:relative;
	left:0;
	top:0;
	background: url(../images/boxcontentleft.gif);
	background-repeat:repeat-y;
}
#left div.box div.boxcontent div.boxcontentcenter{
	width: 220px;
	background: url(../images/boxcontentcenter.gif) no-repeat 194px bottom;
}
#left div.box div.boxcontent div.boxcontentright{
	width: 3px;
	position:relative;
	height:100%;
	left:197;
	top:0;
}
#left div.box div.boxcontentfooter{
	width: 220px;
	height:4px;
	background: url(../images/boxcontentfooter.gif) no-repeat;
}


voila au moins tout est interdependant et ca passe
Modifié par dgsconseil (22 Nov 2005 - 10:32)