Bonjour à tous voila je suis en trin de créer mon site web et j'ai un petit problème je m'explique :
Mon site a une largeur défini ( 1000 px) centré dans le navigateur.
Les haut de page et pied de page sont deux balises externes au conteneur celui si contient 3 autres balises :
- une balise div menu
- une balise contenu
- une balise pub
donc voici mon problème j'aimerai que la hauteur de mon site soit au minimum égale à la hauteur de mon navigateur et que si les éléments contenus dans les balises menu, contenu ou pub sont plus importantes que la hauteur du navigateur, se seront celle ci qui serviront de repère pour la hauteur du site ( la plus grande de l'une de ces trois balises ). J'aimerais aussi qu'en dessous de mon pied de page il y est une marge comme au dessus. Merci pour vos futures réponses.
Voici ma feuille de style :
et la mon document php
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 @charset "utf-8"; /* CSS Document */ html, body { margin: 0px; padding: 0; height: 100%; background-color:#000000; } div#hautpage { margin-top: 10px; width: 1000px; height: 100px; background:#000099; margin-left: auto; margin-right: auto; } div#conteneur { width: 1000px; height: 100%; background:#0000CC; margin-left:auto; margin-right:auto; } div#menu { float:left; width: 150px; height: 100%; background: #0066FF; } div#pub { float:right; width: 150px; height: 100%; background: #0066FF; } div#contenu { overflow: hidden; height: 100%; background: #00CCFF; } div#piedpage { width: 1000px; background-color: #EFEFEF; margin-left: auto; margin-right: auto; margin-bottom: 10px; }
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 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="stylesheet" type="text/css" href="styles/style.css" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="title" content="bla" /> <meta name="description" content="blabla/> <title>titre</title> </head> <body> <!--[if lte IE 6]><style type="text/css"> div#contenu { overflow: visible; height: 1%; } div#menu{ margin-right: 7px; } div#pub { margin-left: 7px; } </style><![endif]--> <div id="hautpage"></div> <div id="conteneur"> <div id="menu">menu</div> <div id="pub">pub</div> <div id="contenu">contenu</div> </div> <div id="piedpage">pied de page</div> </body> </html>
Partager