Header puis bloc occupant 100% du reste de la page

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Header puis bloc occupant 100% du reste de la page

olivier65

Bonjour à tous !! :hello:

Alors voilà mon problème aujourd'hui, en fait mon code HTML ressemble à ça :

Code :

<html>
<head>
</head>
<body>
<div id="header">
</div>
<div id="global">
<div id="contenu">
</div>
<div id="pieddepage">
</div>
</div>
</body>
</html>

Et mon CSS :

Code :

html
{
height: 100%;
}
body
{
background-image: url("/images/rayures.png" );
height: 100%;
margin: 0;
}
#header
{
background-color: gray;
width: 100%;
height: 200px;
margin: 0;
}
#global
{
width: 1400px;
background-image: url("/images/fond.png" );
background-repeat: repeat-y;
margin: auto;
}

Et donc en fait mon header part du haut de la page et descend sur 200pixels, mais ensuite j'aimerais que mon bloc "global" occupe au minimum le reste de la page, pour que mon background descende jusqu'en bas de la page, voire plus si le contenu l'exige. Mais le problème c'est que lorsque j'essaye de mettre à mon bloc global "min-height:100%" à ce moment là il n'occupe pas 100% de l'espace restant (c'est-à-dire 100% - 200px du header) mais il occupe 100% de la page web, et donc j'ai une barre de défilement qui apparait... :pt1cable:

Quelqu'un a t-il une idée du souci ?
Merci d'avance,

Olivier

Publicité

kokusho

Pourquoi ne pas mettre tous simplement ton background sur le body ? et pas sur le bloc de contenu ? t'aurai plus de soucis de hauteur de page.

A moins que je n'ai pas compris ton problème.

Message cité 1 fois

---------------
Dépots d'annonces gratuites entre particulier : http://www.mini-annonces.fr/

olivier65

kokusho a écrit :

Pourquoi ne pas mettre tous simplement ton background sur le body ? et pas sur le bloc de contenu ? t'aurai plus de soucis de hauteur de page.

A moins que je n'ai pas compris ton problème.

Hey, merci d'avoir répondu !
Bon c'est vrai que je n'avais pas pensé à faire ça, mais il se trouve que ça ne va pas être possible parce qu'en fait mon body a déjà une image de fond (des rayures) et donc je veux ajouter sur ces rayures la partie du "global"...

abais

Dis nous le but recherché afin de pouvoir t'aider...

Tu peux faire en sorte que ta <div id="global"> soit fils unique du <body>, cette <div> contenant ton header/contenu/footer...

Message édité par abais le 22-06-2010 à 11:14:35

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.

the prisoner

tu peux aussi attribuer une image a HTML

Ch'DUP

abais a raison, tu appliques ton min-height:100% à une div qui englobe header et contenu et ça devrait rouler

FORUM HardWare.fr

Programmation

HTML/CSS

Header puis bloc occupant 100% du reste de la page

Sujets relatifs
Protection d'une page permettant l'accès à une base de données sql	Faire remonter une valeur dans une page
ouverture nouvelle fenêtre suite à header	Piratage - Page perso Free - .htaccess
[Résolu] Changer couleur du lien de la page active	reponse optenue sujet terminer
Formulaire PHP, retour sur ma page d'origine	[résolu] modification du contenu d'une page en fonction d'un paramètre
"Capturer" des données dynamiques d'une page web ?	VB : Insérer le contenu d'un textbox dans une page web
Plus de sujets relatifs à : Header puis bloc occupant 100% du reste de la page

Page générée en 0.047 secondes