28173 sujets

CSS et mise en forme, CSS3

Bonjour a tous,

j'ai un petit soucis avec mes div. J'ai fouiller le forum et à part si mes yeux commences a flancher je n'est pas trouver la réponse.

Explication :

j'ai un site avec un squelette fait avec 4 DIV principale, mais le hick,

upload/7443-Site.jpg


c'est que comme voici la photo, quand mon contenu et plus grand en longueur que mon menu, mon menu le grandi pas automatiquement, ce qui fait que ca me laisse un blanc sous mon menu. Le Background du menu ne sui pas pck ma DIV reste a 300px.

Si je me suis bien exprimé, que vous avez compris,

auriez vous une solution a ce genre de problème : pour que ma DIv de mon menu grandisse automatiquement jusqu'a mon Footer quand mon contenu grandi.

Merci d'avance pour vos réponde, et dsl je n'est pas l'exemple du site sous la main car il n'est pas encore en ligne, juste en local...

A touti Smiley biggrin
Mon fichier CSS au cas ou...

div#header {
width:948px;
height:142px;
background-image:url(images/html/haut.gif);
text-align:left;
}
div#menu {
float:left;
width:200px;
height:300px;
background-image:url(images/html/menu.gif);
text-align:left;
}
div#contenu {
width:744px;
height:299px;
background-image:url(images/html/contenu.gif);
padding: 1em;
}
div#footer {
width:947px;
height:50px;
background-image:url(images/html/bas.gif);
clear:both;
text-align:center;
}



Merci encore a tout Alsacreation Smiley lol
Modifié par looping (03 Jul 2006 - 16:28)
Salut! =)

Il faut que tu places un div qui contient le menu ET le contenu.

<div id="global">
</div>


Et que tu lui attribues un fond qui contient la largeur du menu plus celle du contenu.

Ex:

/* Taille menu: 100 px
Taille contenu: 700 */

#global	{
	background:url(images/fond_global.gif) repeat-y; /* Fond répèté verticalement */
	width: 800; /* largeur fixe */
	margin:0px; padding:0px; border:none; /* A titre d'exemple */
		}


Après tu places ton menu ( en liste =) ) et ton contenu dans le div global.

Je suis vraiment pas expert css mais c'est comme ça que j'aurais fait. :]