Discussion :

[PoZZyX]

Hello,

Je fais face à quelques problèmes en essayer de réaliser ma page web. Un de ceux ci c'est que je voudrais avoir ma page sur toute la hauteur de la fenetre.

Concernant ma page, en gros, il y a un div conteneur qui fait height=100%, qui contient 2 div, un logo (height 160px) et div de contenu, qui devrait faire tout le reste jusqu'au bas de la page.

Je suis tenté de mettre dans les propriétés de mon contenu une height à 100%, mais cela fait que la page est plus grande que la fenetre (100% + taille logo) et la scrollbar apparait.
Démo

J'ai fait des recherche mais ça correspond jamais à mon problème de débordement.

Une idée de comment corriger ça ?

Merci d'avance pour votre aide

[domb_st]

Essaie de ne mettre tout simplement pas de height à ton 2e div.

[PoZZyX]

Mais il a pas prendre toute la hauteur, et je pourrais pas mettre de paramètre owerflow pour avoir une scrollbar interne au div si nécessaire

[Candygirl]

Si tu donnes comme hauteur fixe à ton contenu le reste de l'éran, les personnes en 800x600 n'auront qu'une toutes hauteur à disposition vu la hauteur que représentent ta bannière et ton menu. Ce n'est donc pas forcément très ergonomique...

Pour obtenir le montage que tu souhaites tu peux peut-être faire du genre:

Positionner ton contenu en absolute et fixer le top et le bottom. Il ne faut pas oublier de donner un position relative sur le container qu'il serve de référence pour le positionnement absolu:

Code css :

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

1
2
3
4
5
6
7
8
9
10
#container {
  position:relative;
}
 
#contenu {
  position:absolute;
  width:100%;
  top:200px;bottom:0;left:0;
  overflow:auto;
}

Mais tu devras passer par du js si tu veux le faire fonctionner pareil sur IE6 qui ne sais pas donner une hauteur à l'aide des 2 propriétés top et bottom définies.

[PoZZyX]

Ok merci bien pour tes informations !!!

Bonne journée