Problème affichage Firefox/IE
Bonjour,
J'essaye depuis quelques jours de me faire un "CV" - basique - en ligne.
Tout s'affiche correctement sous firefox, mais sous IE, une barre de séparation est 15px plus haute qu'elle ne devrait être...
Étrange problème, d'autant plus que le reste semble en place (en même temps il n'y a pas grand chose...)
Quand je mets tout en absolu, rien ne change...
Alors voilà le 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
| <html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="GENERATOR" content="Microsoft FrontPage Express 2.0">
<title>Présentation</title>
<link rel="stylesheet" href="design.css" type="text/css" />
</head>
<body >
<div class="monde">
<img src="monde.gif" height="100" width="200" />
</div>
<div class="barre1">
<img src="barre.jpg" height="1" width="937" />
</div>
<div class="barre2">
<img src="barre.jpg" height="300" width="1" />
</div>
<div class="menu">
<div id="pre"><a href="index.htm" class="lien">Thomas Rudel | Allons à l'essentiel.</a></div>
<span class="for" ><a href="formatio.htm" class="lien">Formation /</a></span>
<span class="exp" ><a href="exp.htm" class="lien">Expérience professionnelle /</a></span>
<span class="inf" ><a href="informat.htm" class="lien">Informations complémentaires /</a></span>
<span class="pou"><a href="pourquoi.htm" class="lien">Pourquoi moi ?</a></span>
</div>
<div class="texte">
<p>Voici pour l'instant mon <a href="RUDEL Thomas CV.pdf">C.V</a> au format PDF, le reste viendra dans peu de temps...</p>
</div>
</body> |
Et le CSS :
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
| body{
margin: 70px 150px 100px 100px;
}
.lien{
color:black;
text-decoration:none;
}
A:hover.lien {
color:red;
}
#pre {
position:relative;
top: 20px;
left: 0px;
font-family: "Arial", "Tahoma", "Trebuchet MS";
font-size: 30px;
}
.for {
position:relative;
top: 82px;
left: 0px;
font-family: "Arial", "Tahoma", "Trebuchet MS";
font-size: 24px;
}
.exp {
position:relative;
top: 82px;
left: 0px;
font-family: "Arial", "Tahoma", "Trebuchet MS";
font-size: 24px;
}
.inf {
position:relative;
top: 82px;
left: 0px;
font-family: "Arial", "Tahoma", "Trebuchet MS";
font-size: 24px;
}
.pou {
position:relative;
top: 82px;
left: 0px;
font-family: "Arial", "Tahoma", "Trebuchet MS";
font-size: 24px;
}
.menu{
width:1000px;
}
.texte{
width:900px;
position:relative;
top: 100px;
left: 30px;
font-family: "Tahoma", "Arial", "Trebuchet MS";
font-size: 16px;
text-align:justify;
}
.monde{
position: absolute;
top: 55px;
left: 650px;
}
.barre1{
position: absolute;
top: 215px;
left: 100px;
}
.barre2{
position: absolute;
top: 215px;
left:100px;
} |
Vous pouvez voir la différence sur www.thomas-rudel.com
Merci d'avance!
