Bonjour tout le monde,
Je me permet de créer ma première discussion car j'ai un problème qui me casse la tête depuis des heures et, malgré mes recherches, aucune solution ne fonctionne.
Voici mon problème, pourtant simple: je souhaiterais que mon contenu occupe 100% de la hauteur de la page et ce même si le contenu est trop court. Donc, que le fond blanc de #global recouvre toute la hauteur de la page dont le fond lui est vert.
Voici mon code source CSS:
J'ai bien appliqué une hauteur de 100% à Body et HTML, avant de l'appliquer à mon #global.
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 html, body { margin: 0; padding: 0; height: 100%; align: center; font: 12px "Calibri", helvetica, sans-serif; background-color: #95a712; } #global { position: relative; width: 750px; min-height: 100%; margin: 0; padding: 0; text-align: left; background-color: #FFFFFF; } #menu { font: 16px "Calibri", helvetica, sans-serif; text-align: justify; padding: 3%; } #menu a { text-decoration:none; padding-top: 10px; padding-left: 10px; padding-right: 30px; margin-right: 20px; border-top:1px solid #000000; color: #000000; } #menu a:hover { border-top:3px solid #95a712; color: #95a712; }
Voici le code source HTML:
D'avance, merci pour votre aide!
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 <html> <head> Blah Blah </head> <body> <div align="center"> <div id="global"> <img src="logo.png"><p /> <div id="menu"> <div id="text-menu"> <a href="index.html">Accueil</a> </div> </div> </div> </div> </body> </html>
A noter que cela fonctionne uniquement sur Chrome![]()
Partager