5568 sujets

Sémantique web et HTML

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 Smiley smile
Kerweb a écrit :
A quel niveau est-ce que j'ai merdé ?

Tu as utilisé un bloc en height:100%, il ne va pas comprendre comme par magie qu'il doit prendre une hauteur de «100% moins la hauteur du pied de page». Et, pour arranger les choses, tu ne peux pas demander une telle hauteur en CSS. Smiley smile

Par contre, tu pourrais positionner ce conteneur en absolu, et fixer ses dimensions de manière dynamique grâce au positionnement absolu:
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 170px;

Et faire quelque chose de semblable pour le menu.

Mais si je voulais réaliser ce design j'utiliserais sans doute le positionnement fixe pour le menu et le pied de page, et laisserais le conteneur principal en height:auto et overflow:visible. Le but étant d'utiliser la barre de défilement principale du navigateur, et pas une barre de défilement interne (peu ergonomique). À voir, car le positionnement fixe a aussi quelques inconvénients que tu n'as pas ici avec le positionnement absolu.

Ceci dit, pour ma part j'éviterais de garder le pied de page fixe à l'écran. Un pied de page contient généralement des informations accessoires, et dans ce cas limiter la hauteur de la zone d'affichage du contenu est une mauvaise idée. Pour le menu de navigation, ça se justifie beaucoup mieux, mais uniquement si le menu contient très peu d'items.

Pour finir: aussi bien le positionnement fixe que le dimensionnement d'un bloc positionné en absolu via ses coordonnées sont des mécanismes non supportés par papy IE6.
Modifié par Florent V. (16 Jan 2009 - 11:32)
Ouch, merci pour toutes ces infos Smiley biggrin (je vois que j'ai encore beaucoup de boulot pour comprendre toute les subtilités css, mais bon, je m'y met petit à petit)

Le truc c'est que la personne veut à tout prix le scroll dans le cadre intérieur (et pas au niveau du navigateur), et que le footer soit toujours visible. Smiley confus et je suis toujours en train de me battre pour lui expliquer le pourquoi du merdier ie6...
Modifié par Kerweb (16 Jan 2009 - 11:40)
Kerweb a écrit :
Le truc c'est que la personne veut à tout prix le scroll dans le cadre intérieur (et pas au niveau du navigateur), et que le footer soit toujours visible.

Lui dire que c'est possible (faire ça avec le positionnement absolu), mais que ça ne sera pas compatible IE6, et qu'il faudra traiter le rendu dans IE6 -- 20% des utilisateurs en France, et c'est bien sûr amené à descendre progressivement -- de manière dégradée: pied de page et menu pas toujours visibles mais positionnés de manière statique.