1 pièce(s) jointe(s)
Css minimaliste et différences IE-FF
Bonjour,
(désolé pour ce post sur un pb qui a l'air récurrent, mais ch'suis largué...)
Je crée un style.css minimaliste pour afficher un bandeau top :
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
| .maintop {
width: 100%;
height: 115px;
background-color: rgb(152, 151, 152);
border-bottom-style: ridge;
}
#imglogo {
float: left;
margin-left: 10px;
margin-top: 5px;
margin-right: 5px;
margin-bottom: 0px;
height: 106px;
width: 106px
}
h1 {
font-family: Arial,Helvetica,Verdana,sans-serif;
font-size: 40px;
font-weight: bold;
line-height: 10px;
color: rgb(128, 0, 0);
}
h3 {
font-family: Arial,Helvetica,Verdana,sans-serif;
font-size: 20px;
font-style: normal;
font-weight: lighter;
color: rgb(128, 0, 0);
} |
Le problème est clairement mis en évidence sur l'image attachée : affichage sous FF à gauche, sous IE à droite : c'est vraiment différent ! et si je supprime la ligne "line-height: 10px;", ça devient correct sous IE mais nul sous FF : la seconde ligne s'affiche sous le bandeau, :( !
Comment faire pour avoir un affichage correct avec ces 2 navigateurs (si tant est que ça soit possible...) ?
Le code hachteumeuleu :
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<!-- The above DOCTYPE and html lines and the meta http-equiv line below the head are critical. DO NOT DELETE them -->
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Mon titre</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div class=maintop>
<img src="img.gif" alt="Mon image" id="imglogo">
<br>
<h1> A</h1>
<h3> Association</h3>
</div>
Blah !
</body>
</html> |
Merci d'avance,
--
jp
PS : l'image n'est pas belle mais permet de voir le pb.
