Allongement du menu automatique

Anonyme

13 septembre 2006 à 17:30:05

bonjours voici le code mon code CSS, le problem c'est pour mon menu qui se trouve sur la gauche de mon site, jaimerais savoir comment faire pour que la longueur du menu s'allonge automatiquement avec la longueur du contenu de ma page. je ne sais pas si c'est trés clair ce que je dis^^ en fait en ce moment, mon menu garde toujours la même taille c'est a dire qu'il sarrete apré mon dernier lien qui est dedans. Mais sur certaine page, le contenu est plus long et donc je voudrais que le menu aille automatiquement jusqu'en bas de la page.
merci

/*Pour toutes les pages du site
/////////////////////////////////////////////////////////////////////////////////////////////////////////*/
body
{
margin: auto; /*a ne pas changer, c'est pour une meilleur disposition */
}

#page /* Pour toutes les pages dans leur contenu (donc sans le menu) */
{
font-size: 90%; /* taille du texte */
padding: 170px; /* marge à l'intérieur des blocs, si tu veux comprendre essais de la changer parce que c'est dûr à expliquer^^*/

}
table /* Pour tous les tableau */
{

border: none; /* pas de bordure */

}

a /* les liens */
{
color: #cccccc; /*leur couleur , si tu veux changer de couleur tu peux mettre leur nom en anglais ou bien télécharge le
logiciel "la boite à couleur" pour obtenir les codes de cette couleur (c'est plus sûr) */
font-weight: bold; /* ils sont en gras */
text-decoration: none; /* ils ne sont pas soulignés */
}

a:hover /* les liens lorsque l'on a le curseur dessus */
{
color: #000000;
}

/* ///////////////////////Pour le menu/////////////////////////////////// */
#defilement /*Le texte qui défile^^ */
{
color: #ffffff;
}

#menu /*Tous les éléments du menu */
{
float: left; /* alignés à gauche */
width: 175px; /* leur taille */
background-color: black; /* à toi de comprendre lol */
margin-right: 10px; /*la marge à gauche */

}

ul /*La ligne ou se situe chaque lien du menu */
{
width: 100%; /*largeur par rapport au menu */
padding-left: 0px;
list-style-type: none; /* pour éviter qu'il y est des petits points devant chaque lien (des sortes de tirets quoi) */
}

#menu li:hover /*en gros c'est pour que la ligne ou on pointe le curseur devienne orange */
{
background-color: orange;
}

/*//////////////////////////////////////////////////////////////////////*/

/* Pour la page d'acceuil
//////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

img , img :hover /*C'est pour éviter qu'un gros trait noir n'entoure les images lorsque l'on pointe le curseur dessus*/
{
border: 0 none;
}

Les commentaire, c'est parceque je l'ai pas fait tout seul^^

Lord Rastagong

13 septembre 2006 à 19:38:53

Je ne crois pas que ce soit possible sauf si tu utilises du PHP et que tu es prêt à faire un fichier CSS par page XHTML.

Mais si tu veux, je peux t'aider pour ça (si tu le veux vraiment

bracor

13 septembre 2006 à 19:40:58

clear: both;

Lord Rastagong

13 septembre 2006 à 19:43:47

J'avais complètement oublié cette propriété.... :euh:

(Je suis 100% ZérO

)

Anonyme

13 septembre 2006 à 20:30:11

et je doi le mettre ou ce code parce que je l'ai mis ds ma partie menu mais ca ne marche pas...

Lord Rastagong

14 septembre 2006 à 16:04:48

T'es sûr d'avoir fait ça:

#menu /*Tous les éléments du menu */
{
float: left; /* alignés à gauche */
width: 175px; /* leur taille */
background-color: black; /* à toi de comprendre lol */
margin-right: 10px; /*la marge à gauche */
clear:both;

}

Si tas bien fait ça, il n'y a pas de raison que ça ne marche pas. o_O

Anonyme

14 septembre 2006 à 17:01:26

oui j'ai fait ca mais ca ne change rien.. :s

Anonyme

14 septembre 2006 à 17:32:47

Tu ajoute un <div id="back"></div> qui englobe tout. exemple :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="skin.css" />
</head>
<body>
<div id="back">
<div id="header"></div>
<div id="menu"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
</body>
</html>

Puis pour le css tu mets :

#back
{
width:lataille;
background-image:url(images/back.jpg);
background-repeat:repeat-y;
}

pour l'image back tu prend le menu+le contenu comme ceci :
Exemple de back

Anonyme

14 septembre 2006 à 20:44:02

je ne compren pa tro pour l'image back... parceque mon menu ce n'est pas une image...

Lord Rastagong

15 septembre 2006 à 16:32:23

Bah t'as qu'à faire que back.png soit un fond noir!

Anonyme

15 septembre 2006 à 19:07:43

Tu pourrais nous montrer le design ou le site si il est sur un serveur pour que nous voyons quel type de design tu utilise exactement.

Anonyme

15 septembre 2006 à 20:43:52

alor voila l'adresse du site: www.cl-product.com

Anonyme

8 décembre 2006 à 21:58:50

jai testé l'image back seulement ca fou le bordel ds mon corps.. il se décal completement, et se resser, alors je ne comprend pas, pourquoi ca l'affecte