Discussion :

[guappi]

Bonjour,

J'ai un problème avec un pied de page qui ne se décale pas en fonction
du contenu. Il reste constament figé en bas de page écran.
Petite précision : Bug sous IE 6 mais pas sous Firefox.


la structure de la page est la suivante :
un fichier header

Code :

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

1
2
3
 
<div id="nav">
  <div class="content" id="content_user">

+
Le corps de page contenant des elements pouvant être extensibles et retractables sur une hauteur indéfinie.
+
un fichier footer

Code :

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

1
2
3
4
5
6
7
 
	 <div id="footer" class="baseline"></div>
      </div> <!-- fin du div content_user-->
    </div> <!--fin du div nav-->
 
  </body>
</html>

les classes css #footer , baseline , #nav, content:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
#footer {
  position: absolute;
  hasLayout: false;
  bottom: 0;
  width: 100%;
}
 
.baseline
{
	background-color: #FFF;
	font-size: 11px;
	margin: 0px auto 0px auto;
	padding: 5px 0px 0px 0px;
	color: black;
	height: 15px;
	text-align: center;
	border-color: #CCC;
	border-width: 1px 0 0 0;
	border-style: solid;
} 
 
#nav {
  position: relative;
  min-height: 100%;
}
 
.content {
  padding-bottom: 30px;
  min-height: 100%;
  margin: 10px;
  margin-top: 40px;
  z-index: 1;
}

Toute aide sera la bienvenue.

[desert]

Je ne comprends pas bien le problème. Tu désires avoir un pied de page fixe ou pas ?

[guappi]

Je souhaite que mon pied de page soit en bas de la fenêtre mais qu'il se décale vers le bas lorsque le contenu du corps de page dépasse la taille de la fenêtre.
J'éspère avoir été assez clair.

[HiRoN]

Salut,

J'ai eu le même problème à une époque et je me suis servi de ce lien (qui pourrait t'être utile, en affichant la source) pour résoudre le problème : Avoir un site 100% hauteur (si contenu < taille = footer en bas de page sinon s'adapte au contenu)

[guappi]

Hélas,
j'ai déjà visionné ce lien et m'en suis largement inspiré mais cela ne résoud pas mon problème car le footer reste fixe en bas de fenêtre après l'extension du contenu.

[ThomasR]

Normal, il est en position:absolute ton footer. Faut le laisser en position:relative et mettre le .content {min-height:95%;}, pas 100% car sinon il y aura pas assez de place pour le footer.