Bonjour,

Je veux centrer horizontalement mon site, j'ai donc crée un bloc "Page"

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
 
#page {
     position: relative; /* on positionne le conteneur */
     margin-left: auto;
     margin-right: auto;
     width: 80%;
     text-align: left;
	 background-color: #FFFFFF;
     }
Mes éléments internes sont positionnés en "position: absolute" ou "position: relative"

Ma question:
Le bloc "global" est centré, mais comment faire pour que mes autres blocs ne dépassent pas du bloc "Global" selon la résolution de l'écran ?

Mon exemple est ici: http://www.princessedunjour.com

Voyez le problème de mon menu notamment , Résultat catastrophique en 800x600 !

Merci pour vos conseils !



Voici mon 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
 
</head>
 
<body>
 
<div id="page">
 
<div id="logo">
 
<a href="http://www.princessedunjour.com">
 
<img id="logo" src="logo.gif" alt="Princesse d'un Jour" /></a>
 
</div>
 
<div id="nav">
 
<ul id="menu_haut">
 
<li><a id="menu1" title="Colliers mariage" href="accessoires-colliers-mariage.htm">ACCUEIL</a></li><span class="separation">|</span> 
 
<li><a id="menu2" title="Bracelets mariage" href="accessoires-mariage-bracelets.htm">COLLECTIONS</a></li><span class="separation">|</span>
 
<li><a id="menu3" title="Pics à cheveux mariage" href="accessoires-mariage-pics-a-cheveux">POINTS DE VENTE</a></li><span class="separation">|</span> 
 
<li><a id="menu4" title="Boucles d'oreilles mariage" href="accessoires-boucles-doreilles.htm">DESIGN</a></li><span class="separation">|</span> 
 
<li><a id="menu5" title="Tiares mariage" href="accessoires-mariage-tiares.htm">A PROPOS</a></li><span class="separation">|</span>
 
<li><a id="menu6" title="Princesse d'un Jour" href="index_eng.htm">CONTACT</a></li><span class="separation">|</span>
 
<li><a id="menu6" title="Princesse d'un Jour" href="index_eng.htm">ESPACE PRO</a></li>
 
</ul>
 
</div>
 
</div>
 
</body>
 
</html>
et mon css

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
 
body {
 
margin: 0; /* pour éviter les marges */
 
text-align: center; /* pour corriger le bug de centrage IE */
 
background-color: #DEDEDE;}
 
img {
 
border-width: 0;
 
border-style: none;
 
}
 
#page {
 
     position: relative; /* on positionne le conteneur */
 
     margin-left: auto;
 
     margin-right: auto;
 
     width: 80%;
 
     text-align: left;
 
	 background-color: #FFFFFF;
 
     }
 
div#nav {
 
position: relative;
 
width: 800px;
 
height: 15px;
 
top: -33px;
 
left: 300px;
 
border-style: solid;
 
border-width: 0;
 
border-color: #CCCCCC;
 
}