Forum d'entraide PHPFrance

Bonjour,

voila j'ai un site qui a 3 blocs.

Un menu a gauche.
Le corps du milieu
Un menu a droite.

Le menu de gauche et le corps n'ont pas de problème.

Le problème vient du menu de droite.

(Pour le voir, allez sur le site et cliquez sur "PTC" dans le menu de gauche.)

Le le menu de droite se décale vers le bas.
J'ai mis un min-height : 500px; dans mon css. J'ai essayé de le retiré et ça ne change rien.

Seulement, le menu descend quand le bloc du milieu s'agrandit.
Et la j'ai essayé de trouver un lien entre le bloc du milieu et le menu de droite et je ne trouve pas.

Je ne sais pas comment aligner les 3 bloc avec leur hauteur et que le bas puisse s'agrandir au besoin.

Si quelqu'un a une idée...

Merci d'avance en tout cas !

AU faite, voici mon CSS:

Code : Tout sélectionner

body {
width : 1024px;
margin : auto;
background : #dee2e3 url(theme/fond-bg.jpg) no-repeat top center;
font-family : Helvetica, Arial, sans-serif;
font-size : 12px;
}
a {
text-decoration : none;
font-weight : bold;
color : #000000;
}
a:hover {
color : #fe7f00;
}
.clear {
clear : both;
}
#en_tete {
width : 455px;
height : 131px;
background-image : url(theme/new-logo.png);
margin-top : 40px;
margin-left : 30px;
margin-bottom : 10px;
}
#conteneur_gauche {
float : left;
width : 158px;
margin-right : 20px;
margin-top : 60px;
}
#menu_gauche {
background : url(theme/menu-g-h.png) no-repeat bottom left;
height : 42px;
width : 158px;
margin-left : 2px;
margin-bottom:12px;
}
#menu_gauche ul li {
list-style : none;
float : left;
width : 158px;
}
#menu_gauche ul li a {
height : 36px;
width : 140px;
font-size : 12px;
text-decoration : none;
text-align : center;
display : block;
background : url(theme/actualite-over.png) no-repeat top left;
line-height : 34px;
color : #000000;
margin : 8px 0 -16px -35px;
}
#menu_gauche ul li a:hover {
background-position : bottom left;
}
#contenu_gauche {
background : url(theme/menu-gauche-milieu.png) repeat-y left bottom;
margin-left : 2px;
overflow: hidden;
}
#contenu_gauche ol li {
list-style : none;
text-align : center;
padding-right : 20px;
margin-left : -25px;

}
#contenu_gauche ol li a {
font-size : 11px;
text-decoration : none;
text-align : center;
line-height : 11px;
}
#contenu_gauche {
background : url(theme/menu-gauche-milieu.png) repeat-y left bottom;
margin-top : -12px;
}
#contenu_gauche ul li {
list-style : none;
}
#contenu_gauche ul li a {
height : 36px;
width : 140px;
font-size : 12px;
text-decoration : none;
text-align : center;
display : block;
background : url(theme/actualite-over.png) no-repeat top left;
line-height : 34px;
color : #000000;
margin : 0 0 -10px -35px;
padding-left : 2px;
}
#contenu_gauche ul li a:hover {
background-position : bottom left;
}
#contenu_gauche_bottom ol li {
list-style : none;
margin-top : 0;
}
#contenu_gauche_bottom ol li a {
font-size : 11px;
text-decoration : none;
text-align : center;
line-height : 11px;
}
#contenu_gauche_bottom_bas {
background : url(theme/menu-g-b.png) no-repeat left bottom;
height : 26px;
width : 158px;
margin-left:2px;
}
#conteneur_milieu {
width : 726px;
margin : auto;
}
#menu_milieu {
background : url(theme/bande-h.png) no-repeat bottom left;
height : 81px;
width : 726px;
margin : -15px 0 0 3px;
font-size : 11px;
text-align : center;
text-decoration : none;
line-height : 22px;
}
#menu_milieu ul li {
list-style : none;
float : left;
}
#menu_milieu ul li a {
height : 44px;
font-size : 12px;
text-decoration : none;
text-align : center;
display : block;
background : no-repeat top left;
line-height : 50px;
font-size : 15px;
color : #000000;
}
#menu_milieu ul li a:hover {
background-position : bottom left;
line-height : 40px;
}
#menu_milieu ul li a.index {
background-image : url(theme/btn-index.png);
width : 98px;
margin : 0 0 0 -35px;
font-size : 13px;
text-align : center;
}
#menu_milieu ul li a.argent {
background-image : url(theme/btn-argent.png);
width : 198px;
font-size : 13px;
text-align : center;
}
#menu_milieu ul li a.filleuls {
background-image : url(theme/btn-filleuls.png);
width : 202px;
font-size : 13px;
text-align : center;
}
#menu_milieu ul li a.forum {
background-image : url(theme/btn-forum.png);
width : 107px;
font-size : 13px;
text-align : center;
}
#menu_milieu ul li a.contact {
background-image : url(theme/btn-contact.png);
width : 95px;
font-size : 13px;
text-align : center;
}
#global_corps {
width : 746px;
margin : auto;
float : left;
}
#corps_haut {
background : url(theme/milieu-h.png) no-repeat left;
background-position : bottom left;
height : 21px;
width : 746px;
margin-left : -35px;
}
#corps_milieu {
background : url(theme/milieu-m.png) repeat-y left;
margin-left : -39px;
padding-right : 80px;
padding-left : 35px;
min-height : 500px;
display : block;
overflow: hidden;
}
#contenu {
display : block;
}
#contenu .titre {
background : url(theme/cadre-interieur-titre.png) no-repeat top left;
font-size : 15px;
display : block;
width : 746px;
line-height : 31px;
font-weight : bold;
padding : 0 0 10px 10px;
margin-top : 10px;
margin-bottom : 10px;
float : left;
}
#corps_milieu div:first-letter {
float : left;
font-size : 2.5em;
font-weight : bold;
margin : 7px 2px 0 0;
width : 740px;
}
#conteneur_droite {
float : left;
width : 152px;
margin-left : 870px;
margin-right : 10px;
margin-top : -540px;
}
#menu_droite {
background : url(theme/menu-g-h.png) no-repeat bottom left;
height : 54px;
width : 152px;
}
#menu_droite ol li {
list-style : none;
float : left;
width : 152px;
margin-bottom:10px;
}
#menu_droite ol li a {
height : 36px;
width : 140px;
font-size : 12px;
text-decoration : none;
text-align : center;
display : block;
background : url(theme/actualite-over.png) no-repeat top left;
line-height : 36px;
color : #000000;
margin : 18px 0 -16px -35px;
}
#menu_droite ol li a:hover {
background-position : bottom left;
}
#contenu_droite {
background : url(theme/menu-gauche-milieu.png) repeat-y left bottom;
overflow: hidden;
margin-top:6px;
}
#contenu_droite ul li {
list-style : none;
}
#contenu_droite ul li a {
font-size : 11px;
text-decoration : none;
text-align : center;
line-height : 11px;
margin-left : -15px;
margin-top:-5px;
}
#contenu_droite_bas {
background : url(theme/menu-g-b.png) no-repeat left bottom;
height : 26px;
width : 146px;
}
#corps_bas {
background : url(theme/milieu-b.png) no-repeat;
width : 746px;
height : 54px;
margin : 0 0 0 139px;
padding : 22px 0 0 0;
font-size : 12px;
text-align : center;
line-height : 12px;
float : left;
}

Bonjour =D

Voila, j'ai le même problème, mais en HTML.
Comme je suis débutante (oui oui XD) je cherche toute les réponses sur le web pour le HTML mais je n'ai aucune connaissance dans le CSS, à part peut être pour copier un code et faire un menu d"roulant avec ce code XD

Mon site n'est pas encore en ligne, je le fais avant.
Sauriez-vous comme résoudre le problème?

Modération :
Sakura-chan, si tu as une autre question ouvre un nouveau sujet,
cela te permettra d'avoir plus de réponses.

En plus, tu pourras mettre [Résolu] dès que ton problème sera réglé.

Merci de prendre le temps de lire les règlements.

Forum d'entraide PHPFrance

Probleme d'alignement avec le menu de droite.

Probleme d'alignement avec le menu de droite.

Re: Probleme d'alignement avec le menu de droite.

Re: Probleme d'alignement avec le menu de droite.