[résolu]Problème de position et taille de 2 divs sur toute la page

Hello
J'essaie de mettre un bandeau horizontal (100% en largeur et 20 pixels de hauteur) en haut d'une page web et une autre div sur toute la surface restante où l'utilisateur pourra naviguer sur un site tout en conservant ce bandeau en haut du navigateur.

Avec un système de frameset c'est très facile à mettre en place mais je me demandais si c'était possible avec des div+css et je bute sur ce problème :
je ne peux pas utiliser de taille fixe pour définir la taille de ma div du bas (avec le site web) car il s'agit en fait de :
height : 100% - 20px;

Je ne peux pas utiliser non plus 96% pour cette div et 4% pour mon bandeau, car cela changerait suivant la résolution d'écran du visiteur...

Y-a-t-il une solution simple ?

Thanks!
Modifié par ChatSys (14 Feb 2007 - 16:06)

ChatSys a écrit :
Y-a-t-il une solution simple ?

Non.

Une possibilité, cependant :
- faire un conteneur qui prendra 100% de la hauteur ;
- placer un en-tête en positionnement fixe (position: fixed) en haut de ce conteneur ;
- gérer le chevauchement des éléments (inévitable avec un bloc positionné en absolu ou en fixe) en donnant un padding-top (de 30px par exemple) au premier élément qui suit le bloc d'en-tête.

Le positionnement fixe sera compris par tous les navigateurs modernes, ce qui n'inclue pas IE6. Pour IE6 et inférieurs, on basculera sur un positionnement absolu (on réalisera cette correction dans une feuille de style appelée via un commentaire conditionnel).

La FAQ du forum donne quelques indications sur comment donner une hauteur de 100% à un élément, sur les commentaires conditionnels, etc.


Au passage : ne pas écouter tous ceux qui prétendront qu'en bidouillant les propriétés overflow de html, body, et un conteneur global, on peut obtenir un positionnement fixe même pour IE6. Il s'agit de bricolages peu fiables, lourds à mettre en place. Le jeu n'en vaut tout simplement pas la chandelle.


PS : j'ai modifié ta signature conformément aux règles du forum.
Modifié par Florent V. (10 Feb 2007 - 12:21)

Merci pour cette réponse enrichissante d'expérience !

Dans mon cas je pense que je vais utiliser un frameset en attendant que IE6 tombe dans les oubliettes et utiliser des div par dessus la page pour ce qui est des block à afficher par dessus la page :

-Frameset
---> bandeau
---> page contenant iframe 100% + un div qui s'affichera par dessus lorsque le bandeau en aura besoin

PS: désolé pour signature, merci de l'avoir corrigée