[CSS][xHTML] Mise en page
Bonjour,
J'essaie de gérer mon futur site avec css/xhtml.
Le problème c'est que mon footer se positione en fonction de la balise "centre" et pas celle du menu de gauche (gauche). Ce qui fait j'ai du texte du pied de page dans mon menu.
En gros c'est pour avoir qqch comme: un header, un menu à gauche et le contenu a coté, et un footer.
Voici mon css:
Code:
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
| /*
Outremondes
*/
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
margin: 0;
padding: 0;
background-color:black;
color: #FFFF99;
}
#content {
position: absolute;
}
#header {
height: 130px;
}
#footer {
clear:both
}
#gauche {
position: absolute;
left:0;
width: 150px;
}
.menugauche {
list-style-type: none;
margin: 0;
padding:0;
}
#centre {
margin-left: 150px;
} |
Et ma feuille xhtml pour terminer:
Code:
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
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>Outremondes</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="include/OMfixe.css" media="screen" />
</head>
<body>
<div id="content">
<div id="header">
<img src="img/banniere.png" alt="Banniere Outremondes" />
<br/>
</div>
<p>
<a href="#"><img src="img/b_contactez_nous_off.png" alt="Contactez-nous" /></a>
<a href="#"><img src="img/b_crieurs_publics_off.png" alt="Crieurs public" /></a>
<a href="#"><img src="img/b_salle_des_etats_off.png" alt="Salles des etats" /></a>
<a href="#"><img src="img/b_forum_off.png" alt="Forum" /></a>
<a href="#"><img src="img/b_infos_serveur_off.png" alt="Infos serveur" /></a>
<a href="#"><img src="img/b_telechargez_jeu_off.png" alt="Telecharger le jeu" /></a>
</p>
<div>
<div id="gauche">
<ul class="menugauche">
<li>
Menu 1
<ol>
<li>numero1</li>
<li>numero2</li>
<li>numero3</li>
</ol>
</li>
<li>Menu 2</li>
<li>Menu 3</li>
<li>Menu 4</li>
</ul>
</div>
<div id="centre">
<h1>WELCOME</h1>
Hello World
<br/>proutprout
</div>
</div>
<div id="footer">
JE SUIS UN PIED DE PAGE
</div>
</div>
</body>
</html> |
Voila, si qqun a une idée ou qqch à me proposer je suis toute ouïe
J'aimerais que le footer se décale vers le bas en fonction du centre et du menu gauche.
Merci!
