[Pb CSS] Adaptation du modèle CSS 12

Bonjour j'ai un souci avec une adaptation du modèle http://css.alsacreations.com/modeles/modele12.htm
En effet je voudrais que le footer ait une hauteur fixe (125px) et que la "frame centrale" au contraire aie une hauteur variable (et qui soit systématiquement la hauteur restante de la page, qu'il y ait très peu de contenu ou suffisamment pour avoir besoin d'un scroll).

J'ai beau essayer différentes astuces (position, margin, padding, display,... )je tourne en rond. Quelqu'un peut-il m'aider ?
Modifié par Dark11Wolf (05 Jan 2008 - 18:47)

Dark11Wolf a écrit :
En effet je voudrais que le footer ait une hauteur fixe (125px) et que la "frame centrale" au contraire aie une hauteur variable (et qui soit systématiquement la hauteur restante de la page, qu'il y ait très peu de contenu ou suffisamment pour avoir besoin d'un scroll).

À ma connaissance, en positionnement CSS c'est possible uniquement avec le positionnement absolu, de la manière suivante:

div#machin {
	position: absolute;
	top: 100px;
	bottom: 125px;
}

Pas compatible IE6: il faudra envisager un mécanisme de dégradation gracieuse pour ce navigateur, via un commentaire conditionnel par exemple.

On peut aussi envisager l'utilisation de position: fixed pour l'en-tête et le pied de page, et laisser le bloc central en hauteur libre. Là encore, pas compatible IE6.

Enfin, ces deux solutions posent des problèmes d'ergonomie, voire d'accessibilité. Je ne les détaille pas, mais dans l'ensemble je déconseille ce type de mise en page avec deux bandeaux fixes.

Pas d'autre solution à ma connaissance.

il subsiste un problème la frame centrale ne prend pas 100% de la place disponible (actuellement j'ai bien les 2 bandeaux comme je veux mais le corp n'est pas suffisamment grand si le texte est trop court

Dark11Wolf a écrit :
il subsiste un problème

Où ça? Sur quelle page, visible à quelle adresse?

Et est-ce que tu as tenté une des deux méthodes que j'indique, ou bien autre chose encore?

Autant pour moi tu as bien raison pour le code (je n'ai pas encore regardé la compatibilité IE6, je teste sous FireFox pour le moment). EN faisant un exemple simple ça fonctionne

Il me reste donc à simplifier mes trop nombreux div... merci de ton aide (une fois ce problème résolu je regarderais la compatibilité^^)