Menus + contenu jusqu'en bas de page ?

Bonjour à tous

Alors, voilà je vous expose mon problème, ça fait un moment que je me prends la tête là dessus :

J'ai fait une page contenant un menu à droite, un à gauche, plus le contenu au milieu, et je voudrais bien que "tout le monde" aille jusqu'en bas de page, plutôt que de s'arreter bêtement dès qu'il n'y a plus de contenu à afficher...

Ci dessous un exemple de ce que j'ai :

http://poch.cliranet.com/site.jpg

Donc j'aimerais bien que le menu de droite et le contenu se calent au niveau du menu de gauche dans le cas ou celui-ci est plus long, et vice versa si le menu de gauche est plus court que le contenu, qu'il se finisse au même niveau que celui-ci.

Voilà un exemple de ce que je voudrais faire : http://diablo2.judgehype.com

Merci d'avance pour vos réponses !

Poch

Hello Poch et bienvenue

En clair, tu voudrais des colonnes de même hauteur, c'est ça ?

Attention à bien prendre le temps (et la courtoisie) de lire le message qui s'adresse aux nouveaux sur le forum, il t'aurait expliqué comment trouver ce genre de réponses très vite
Modifié par Raphael (13 Nov 2005 - 15:37)

Ah, pourtant j'avais lu ce post et il m'a permis d'apprendre pas mal de choses, mais pas ce que je voulais faire vraiment. Désolé...

En tout merci beaucoup, je vais essayer tout de suite !

Bonjour, bonjour

Je re-up mon poste, car hélas la page sur les colonnes de même hauteur n'a pas aidé à résoudre mon problème. Les solutions proposées ne sont pas viables dans mon cas.

En effet, l'astuce proposée est de mettre derrière le menu un gros conteneur qui englobe le milieu de page aussi, le conteneur d'arrière plan étant de la même couleur que le menu. Car en réalité, si l'on mettait une bordure au menu "réel" on verrait ça :

http://css.alsacreations.com/xmedia/exemples/cellules/image3.gif

Maintenant, jetez un oeil chez moi... ( http://www.fable-fr.net ) On comprend que je ne puisse pas appliquer cette solution.

J'aimerais éviter d'avoir recours aux tableaux, car je veux bien séparer la partie contenu de pages et mise en forme, et je trouve CSS génial pour ça !

Voici des extraits de mon code :

//Ce conteneur contient tout sauf les marges de quelques pixels au bord de la fenêtre...

#conteneur général {
	position: static;
	background-image: url(pics/nav/5+.png);
	border: 1px outset #000000;
	height: 99%;
	width: 100%;
	margin-top: 3px;
}

#menugauche {
        position: absolute;
        background-image: url(pics/nav/5--.png);
        border: 1px #272727 solid;
        left:10px;
        width:90pt;
        margin-left: 7px;
}

#menudroit  {
        position: absolute;
        background-image: url(pics/nav/5--.png);
        border: 1px #272727 solid;
        right:10px;
        width:110pt;
        margin-right: 6px;
        }

// Pour IE
#milieupage {
	position: static;
	background-image: url(pics/nav/content.png);
	padding: 8px;
	border: 1px solid #322C27;
         margin-left: 103pt;
         margin-right:122pt;
	margin-bottom: 3px;
	height:735px;
}

// Pour les autres navigateurs
html>body #milieupage {
	position: static;
	background-image: url(pics/nav/content.png);
	padding: 8px;
	border: 1px solid #322C27;
         margin-left: 103pt;
         margin-right:122pt;
	margin-bottom: 3px;
	height: auto;
	min-height:735px;
}

Auriez-vous une solution valable sans que je sacrifie les positions absolute de mes menus et les arrières plans et bordures ?

Parce que moi je cherche, je cherche... Mais je trouve pas !

Merci d'avance

Poch
Modifié par Poch (15 Nov 2005 - 16:12)

Pour ce que je vois de ton site, si je ne m'abuse, il y a un gabarit css qui pourrait correspondre à ce que tu recherches. Les petites colonnes ou le contenu poussent avec leurs petites mains viriles le footer qui sent les pieds
Je découvre comme toi les lieux et il est vrai que c'est un dédale très riche où on se perd vite si on te donne pas la main

La preuve, je suis perdu
Modifié par globy (15 Nov 2005 - 16:24)

Pour le gabarit si tu parles de celui-là, il s'applique encore une fois seulement dans le cas ou le menu ne comporte ni image de fond, ni bordure...

Et quant à ton problème... Désolé, mais je ne vois pas quoi faire, j'aurais fait comme toi, mais apparament ça ne marche pas.

déjà eu le cas...moi je fais (c'est peut-être pas élégant mais ça marche) un motif dans la balise html, un motif dans la balise body ...je fais répéter sur l'axe y...et tes menus auront l'air de descendre jusqu'en dessous
Par exemple :

html{
	background-image:utl('motif_menu_droit');
	background-repeat:repeat-y;
	background-position:left	
}
body{
	background-image:utl('motif_menu_gauche');
	background-repeat:repeat-y;
	background-position:right	
}

En te relisant, Poch, je crois avoir compris à présent ton soucis
//edit : zut je n'ai trouvé que ça

PS : merci de t'être penché sur mon problème également, très sympathique à toi.
Modifié par globy (15 Nov 2005 - 17:36)

Merci pour ta réponse hasgaard !

Le problème est que j'utilise déja une image en background dans mon body{}...

Mais si je comprends bien dans ta solution le motif est le fond de ton menu gauche par exemple, et dans la page web ce qu'on voit ce n'est pas vraiment une boite avec un arrière plan et des bordures et du texte à l'intérieur, mais une image qui se répète avec du texte au dessus ?

Aurais-tu un exemple de page à me montrer avec cette solution pour que je puisse voir un peu ce que ça donne ?

Mais si quelqu'un a une solution plus propre je suis preneur, j'aimerais bien faire ça dans les règles de l'art, si j'ose dire...

Ce qui est byzarre avec ta page globy, c'est que les float left sont censés flotter cote à cote justement... Juste pour savoir si tu réduis la taille de ton .contenu à 50% le problème se pose toujours ?

@Poch : fausse alerte (voir mon édit). Dans mes souvenirs je pensais tenir un garabit css qui allait jusqu'au bas de l'écran dans toutes les colonnes. J'ai dû voir ça ailleurs. Mais là, dans cet exemple, le footer et le header sont fixes comme tu peux le voir.

Pour ta suggestion sur mon problème, merci tout plein, j'ai un début de soluce. Je t'y ai répondu là-bas


//edit : ton conteneur "général" avec les accents, ça se fait ?
Sinon je vois pas tes images de background, tant dans le body que pour les menus. Sous Firefox.
Modifié par globy (15 Nov 2005 - 18:08)

les noms des balises ont été modifiés pour simplifier la lecture du code ici. Chez moi ça s'appelle navbar, rightbar, content, tout...

Par contre je ne vois pas ce que tu veux dire pour les images de fond avec Firefox, j'ai testé mon site sous IE, FF, Opera, Konqueror et Mozilla, sans problèmes nulle part...

Alors il n'y a vraiment personne qui n'ait solution à ce problème en CSS ??? Parce que quand je fais afficher la source sur une page comme http://diablo2.judgehype.com tous les <table> <tr> et <td>... Ca me fait peur !

Au point que je me demande si le gars a vraiment fait sa mise en page comme ça !