[Browsers] positionner un div
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:
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:
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;
} |
Re: positionner un div pbl firefox et ie
Citation:
Envoyé par pp51
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.
Que veux-tu dire exactement? Sur ta page, ton logo est déjà sous le menu. :?
Citation:
Envoyé par pp51
sur ff, mon bloc "Page" n'est plus en blanc... bref je pige rien !
Pourtant, je le vois bien en blanc. Actualises et/ou vides le cache du navigateur.
