28173 sujets

CSS et mise en forme, CSS3

Images qui s'adaptent a la hauteur d'un menu accordéon ?

bonjour

Je vais utiliser un menu type accordeon (moo fx) et je souhaiterai que les images des divs entourant le div de mon menu suivent la hauteur (variable) du menu...

Je pense construire cela comme ça

<div id="conteneur">

<div id"image de gauche"></div>
<div id"monMenuAccordeon"></div>
<div id"image DeDroite"></div>

</>

<div id"imageSousLeMenu"></div>


En css, comment dire a une image de remplir systematiquement toute la hauteur d'une cellule ?

D'avance merci
Modifié par ze.bassman (09 Sep 2007 - 00:47)
Bonjour aussi...

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Modifié par Mikachu (08 Sep 2007 - 21:46)
oups...

Mille excuses. Il est vrai que les regles de bonnes conduites sont faites pour être appliquées. Je tacherai de m'y conformer à l'avenir. Je vais de ce pas me flageler.

Voilà, j'ai édité mon post pour le rendre conforme.

EDIT : Alors la... je cale !!!

En fait, j'ai deux problemes :
1 le placement des divs "imgVG", "content" et "imgVD"
2 je ne sais pas comment faire pour que les images contenues dans les div "imgVD" et "imgVD" suivent la déformation verticale du menu...

Pour que ce soit plus concret voici le lien
http://interface38.free.fr/fullCSS/BoitepageTypePhase1.html



et le css qui me pose probleme (colonne bleu et son contenu)

div#colGauche	{
 	float: left;
	margin: 0px 0;
	background:#1E2455;
	height: 500px;
	width: 200px;
	overflow: hidden;

	}
	
div#TitresColGauche	{
	text-align: center;
	background-image: url(../imgs/maggassurAccueil_24.jpg);
	height:41px;
	background-repeat: no-repeat;
	

}

div#imgVD	{
	width:23px;
	height:300px;
	background-image: url(../imgs/MENUVerticDROIT.gif);
	float: right;
	position: static;
	left: 228px;
	top: 189px;
}

div#ImgVB	{
	height:33px;
	background-image: url(../imgs/MENUVerticBAS.gif);
	
}

	
div#content {
	background: url('../imgs/menu_fond.gif') repeat-y;
	width:154px;
	margin-top: 0px;
	margin-left: 0px;
	
}

div#bas {
	background: url('../imgs/menu_bas.gif') no-repeat center bottom;
	padding-top: 0px;
	padding-bottom: 0px
	/* height: 4px -> bug sur Internet Explorer */
}


.menutitre {
	background: url('../imgs/menu_titre.gif') no-repeat;
	text-align: center;
	color: #FFFFFF;
	font-family: "Trebuchet MS",helvetica,sans-serif;
	font-weight: bold;
	margin: 0;
	height: 20px;
	cursor: pointer;
	font-size: 12px;
	width: 154px
}



.stretcher {
	background-color:#FF9900;
	text-align:left;
	font-weight: bold;
	font-size:11px;
	line-height: 27px
}

.stretcher a {
	background: transparent url('../imgs/menu_etoile.gif') no-repeat 8px 2px;
	padding-left:26px;
	color: #1E2454;
	text-decoration: none
}

.stretcher a:hover {
	color: #FFFFFF
}

Merci beaucoup pour votre aide et votre indulgence, c'est mon premier contact avec le css, cela ne fait que 3 jours que je m'y suis mis et je suis sur que mon code est plein d'hérésie. Vos conseils et corrections me seront très précieux et je vous remercie du temps que vous consacrerez a m'aider.
Modifié par ze.bassman (09 Sep 2007 - 03:48)
Sujet clos
Aller à