pied de page reste en bas, ça serait bien

**mickael28** · 21/07/2008, 23h00

Bonsoir,

J'ai un soucis avec ma position de mon pied de page que j'aimerai bien résoudre.
Je voudrai qu'il reste toujour en bas, même si il y a un gros blanc entre lui et
le reste de ma page.

(J'ai vus une soluce sur le forum posté par Blueice en février dernier, mais c pas terrible pour mon cas.)

voici le code:

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
     <title></title>
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
     <link rel="stylesheet" type="text/css" href="Général.css" />	
 
</head>	
 
<body>
      <div id="body">
 
             <!-- en-tête -->
	<div id="divTop">	
		<table border="1">
			<tr>	
			<td> <h1>BANNIERE</h1></td>
			<td id="divTopImg"><img src="..." alt="..."></img></td>
			</tr>
		</table>
	</div>
 
	<!-- Menu -->	
	<div id="divLeft">
		<div  id="divLiens">
		             <ul>
			<li><a href="....html">Lien</a></li><br><br>			
			<li><a href="....html">Lien</a></li><br><br>		
			<li><a href="....html">Lien</a></li><br><br>		
			</ul>
		</div>
	</div>  
 
	<!-- Corp -->
	<div id="divBody">
		<div id="divCenter1">
			<p>
			<img src="..." alt="..."></img>
			Texte de la divCenter1 de la divBody
			</p>
		</div>			
	            <div id="divCenter2">
			<h3>TITRE</h3>
			<table border="1">
				<tr>
				<td><a href="..."><img src="..."></img></a></td>
				<td><a href="..."><img src="..."></img></a></td>
				<td><a href="..."><img src="..."></img></a></td>
				<td><a href="..."><img src="..."></img></a></td>
				</tr>
			</table>
		</div>
	</div>
 
             <!-- Pied de page -->
	<div id="divBottom">
		<a href="...">Lien</a>
	</div>
       </div>
</body>
</html>

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
 
a{
color:blue;
text-decoration:none;
}
 
body {
background-color:#ffffcc;
text-align:center;
}
 
#body {
background-color:red;
width:1000px;
height:100%;
text-align:center;
margin:0px;
margin-top:20px;
margin-bottom:10px;
padding:0px;
}
 
 
/*------------ DIV TOP ------------*/
#divTop{
background-color:#ffffcc;
width:1000px;
}
 
#divTop  table{
background-color:#00CCCC;
border-width:2px;
border-style:thin;
border-color:black;
}
 
#divTop img{
height:70px;
}
 
#divTop h1{
font-family:helvetica;
padding-top:15px;
padding-left:20px;
padding-right:20px;
}
 
 
/*------------- DIV LEFT ------------------*/
#divLeft{
background-color:#00CCCC;
width:200px;
margin-top:50px;
text-align:left;
float:left;
}
 
#divLiens ul {
padding-left:0px;
padding-right:10px;
padding-top:10px;
}
 
#divLiens a {
}
 
#divLiens a:hover {
text-decoration:underline;
} 
 
 
/*-------------------DIV BODY ---------------------------*/
#divBody {
width:795px;
margin-top:50px;
padding-left:10px;
}
 
/*------------------- DIV CENTRE 1 -----------------------*/
#divCenter1{
background-color:#00CCCC;
text-align:left;
}
 
#divCenter1 img{
width:170px;
float:left;
margin-right:20px;
}
 
#divCenter1 p{
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
}
 
/*------------------ DIV CENTRE 2 -----------------*/
#divCenter2 {
background-color:#00CCCC;
margin-top:20px;
margin-bottom:10px;
}
 
#divCenter2 h3{
margin-top:10px;
margin-left:10px;
}
 
#divCenter2 img{
width:80px;
border-style:none;
}
 
#divCenter2 table{
margin-left:10px;
}
 
 
/* -------------------- DIV BOTTOM ---------------*/
#divBottom{
width:1000px;
background-color:#00CCCC;
text-align:center;
position:relative;
}
 
#divBottom a{
padding-left:10px;
}

Pour ce qui est de l'attribut Position dans Div Bottom, à relative le pied de page est bien centré avec le reste, mais à Absolute il est complètement décalé en bas à droite.

Merci d'avance pour l'aide que vous pourrez me donner.

**Erwan31** · 22/07/2008, 00h44

Bonsoir,
a priori tu es en mode Quirks (il te manque le doctype en haut du doc sauf si tu ne l'as pas
copié), ensuite tu oublies sans doute de préciser certains détails dans ton énoncé, notament sur ce que tu ajoutes avec le positionnement absolue...

**mickael28** · 22/07/2008, 08h41

Envoyé par Erwan31

Bonsoir,
a priori tu es en mode Quirks (il te manque le doctype en haut du doc sauf si tu ne l'as pas
copié), ensuite tu oublies sans doute de préciser certains détails dans ton énoncé, notament sur ce que tu ajoutes avec le positionnement absolue...

Merci pour ta réponse.

En effet je n'avais pas mis de DOCTYPE.

Ensuite pour les détails dont tu parle, pourrais-tu être plus explicite?

pied de page reste en bas, ça serait bien

CSS

Discussions similaires

Partager

Partager