Opera avec float:left et width:auto
Bonjour,
J'ai un petit problème d'affichage avec opéra et safari aussi je pense.
Je suis parti d'une grosse image mais j'ai du la découper en quatre car chaque image a un alt différent.
J'ai fait ceci :
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
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
#header {
width: 100%;
background-image: url("../images/fond-recherche.gif");
background-position: right;
background-repeat: repeat-y;
}
#banniere {
margin: 0em;
padding: 0em;
width: 100%;
overflow: hidden;
background-image: url("../images/fond-banniere.gif");
background-position: left;
background-repeat: repeat-y;
}
#logo {
margin: 0em;
padding-left: 2.3em;
height: auto;
float: left;
width: auto;
}
.flottantGauche {
float: left;
}
</style>
</head>
<body>
<div id="header">
<div id="banniere">
<div id="logo">
<div class="flottantGauche">
<img src="./img1.gif" width="60px" height="45px" alt="toto" /><br />
<img src="./img2.gif" width="60px" height="45px" alt="titi" />
</div>
<div>
<img src="./img3.gif" width="89px" height="76px" alt="tutu" /><br />
<img src="./img4.gif" width="89px" height="14px" alt="tata" />
</div>
</div>
</div>
</div>
</body>
</html> |
J'ai épuré un peu le code
Vous aurez besoin de faire 4 images pour tester:
img1 60 x 45
img2 60 x 45
img3 89 x 76
img4 89 x 14
Sous firefox, IE6 et IE7 pas de problème j'obtiens bien un résultat similaire à une grosse image mais le fait de mettre un width: auto; ne fonctionne pas avec opéra.
auriez vous une idée pour faire fonctionner ce bout de code ?
merci
