Discussion :

[Kerweb]

Hello,

J'aurais une petite question, j'essaye de faire un calage un peu spécifique :
http://kerweb.olympe-network.com/test/

J'ai un conteneur principal qui prend toute la hauteur de la page, un footer qui vient automatiquement en pied de page, un menu gauche qui prend toute la hauteur moins la hauteur du footer et une partie centrale qui réagit comme le menu de gauche avec en plus la spécificité de faire apparaitre un scroll quand le contenu est trop grand.
J'ai plus ou moins réussi à faire ce que je voulais, sauf que le menu et la partie centrale passe en dessous du footer et ne s'arrête pas au niveau de celui-ci.
A quel niveau est-ce que j'ai merdé ?
Si quelqu'un voit des améliorations à donner sur ce code, je suis preneur.
A noter que dans le footer, il y aura un menu déroulant vers le haut (qui sera donc amené à passer par dessus le cadre central.

Merci d'avance

[Macmillenium]

Bonjour,

Quel est l'intérêt de ta mise en page avec des blocs en position absolute ?

Tes 3 blocs sont retirés du flux naturel, Les éléments passent l'un au dessus de l'autre (comme tu n'as pas de z-index, l'ordre est le même que dans le code).
Tu as un height:100% (c-à-d 100% du conteneur) sur menu_gauche et menu_gauche, ils passent alors (comportement normal) au dessus de ton footer.

Je te conseille de faire une mise en page classique avec float-left c'est plus facile à maintenir.

[Kerweb]

Avec ça je peux faire en sorte que les 2 colonnes centrales prennent toutes la hauteur, moins la hauteur du footer ?

[Macmillenium]

Oui.

[GihefBey]

Bonjour,

Avant de tout bouleverser, essaye d'ajouter

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.menu_gauche, .frame {
  margin-bottom : hauteur_du_footer_px;
  }

ou

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.menu_gauche, .frame {
  padding-bottom : au_moins_la_hauteur_du_footer_px;
  }

-

[devyan]

Bonjour,

Avant de tout bouleverser, essaye d'ajouter

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.menu_gauche, .frame {
  margin-bottom : hauteur_du_footer_px;
  }

ou

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.menu_gauche, .frame {
  padding-bottom : au_moins_la_hauteur_du_footer_px;
  }

-

Salut,

Je penche plutôt pour la première solution (margin) pour que la barre de défilement vertical soit bien positionnéeau dessu du footer également.