Bonjour à tous,

J'ai crée un div#page qui centre l'ensemble sur un navigateur, cela fonctionne bien.

J'ai ensuite un menu qui se positionne bien en haut.

Mon problème est maintenant de positionner mon logo en dessous du menu, en essayant de le positionner à qq pixels à gauche et qq pixels en dessous du menu.

J'ai de grosses différences entre ie et firefox comme l'atteste la page:
http://www.princessedunjour.com

sur ff, mon bloc "Page" n'est plus en blanc... bref je pige rien !


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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="identifier-url" content="http://www.princessedunjour.com" />
<title>Princesse d'un Jour - Bijoux et accessoires pour le mariage</title>
<meta http-equiv="content-language" content="fr" />
<meta name="description" content="Princesse d'un Jour propose des bijoux et accessoires pour le mariage. Colliers de mariage en cristal Swarovski et perles, pics à cheveux pour votre chignon et votre coiffure de mariée." />
<meta name="keywords" content="bijoux mariage, bijoux fantaisie, accessoires mariage, accessoire mariage, bijoux fantaisie mariage, salon du mariage, bijoux fantaisies, collier mariage, recherche accessoire mariage, accessoire robe de mariee, coiffure mariage, coiffure mariee, mariage, accessoire coiffure, bijou mariage, bijoux swarovski, bijoux en perle swarovski, chignon de mariee, coiffure de mariee, vente bijoux fantaisie, princesse d'un jour, robe de mariee" />
<meta name="Author" content="princessedunjour.com" />
<meta name="copyright" content="princessedunjour.com" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="noindex, nofollow" />
<link rel="stylesheet" type="text/css" href="nouveau2.css" />
<style type="text/css">
</style>
</head>
<body>
     <div id="page">
                    <div id="nav">
                       <ul id="menu_haut">
                           <li><a id="menu1" title="Colliers mariage" href="accessoires-colliers-mariage.htm">ACCUEIL</a></li>
		                   <li><a id="menu2" title="Bracelets mariage" href="accessoires-mariage-bracelets.htm">COLLECTIONS</a></li>
		                   <li><a id="menu4" title="Boucles d'oreilles mariage" href="accessoires-boucles-doreilles.htm">DESIGN</a></li>
		                   <li><a id="menu3" title="Pics à cheveux mariage" href="accessoires-mariage-pics-a-cheveux">POINTS DE VENTE</a></li>
		                   <li><a id="menu5" title="Tiares mariage" href="accessoires-mariage-tiares.htm">A PROPOS</a></li>
		                   <li><a id="menu3" title="Pics à cheveux mariage" href="accessoires-mariage-pics-a-cheveux">CONTACT</a></li>
                           <li><a id="menu6" title="Princesse d'un Jour" href="index_eng.htm">ESPACE PRO</a></li>
                        </ul>
                        </div>
					 <div id="logo">
					 <a href="http://www.princessedunjour.com">
                     <img id="logo" src="logo2.gif" alt="Princesse d'un Jour" /></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
 
body {
margin: 0;
text-align: left; /* pour corriger le bug de centrage IE */
background-color: #EBEBEB;
}
img {
border-width: 0;
border-style: none;
}
#page {
position: relative; /* on positionne le conteneur */
margin-left: auto;
margin-right: auto;
width: 920px;
text-align: left;
background-color: #FFFFFF;
}
div#nav {
	float: left;
	height: 25px;
	top: 90px;
	right: 100px;
	width: 100%;
	border-style: solid;
	border-width: 0;
	border-color: #CCCCCC;
}
ul#menu_haut {
margin-top: 8px;
margin-bottom:8px;
padding: 0;
letter-spacing: 0.2em;
list-style-type: none;
font-family: Arial, Times, serif;
font-size: 10px;
margin: 15px 10px;
text-align: center;
}
#menu_haut li {
display: inline;
margin: 0 15px;
}
#menu_haut a {
color: #999999;
text-decoration: none;
text-align: left;
}
#menu_haut a:hover {
color: #000000;
}
div#logo {
float:left;
height: 66px;
top: 50px;
right: 100px;
border-style: solid;
border-width: 0;
border-color: #CCCCCC;
}