[Résolu] Avoir une largeur proportionelle à la hauteur pour une image

Bonjour!

Petite question bien simple. J'ai codé un slideshow et j'ai donc une bande contenant des miniatures de chaque image.

Puisque je peux avoir des images soit en paysage ou bien en portrait, j'ai seulement défini la hauteur des images dans mon css :

#slider img {
  height: 145px;
  ...
}

Comme je développe toujours en Firefox en premier, tout semblait fonctionner. Jusqu'à ce que j'arrive sous IE, peu importe la version, même la 9!

Sous FF, L'image sera redimensionnée proportionnellement. Donc si l'image faisait 1450 x 1450, elle fera maintenant 145 x 145. Mais sous IE, elle fait 1450 x 145.

Y-a-t'il une solution CSS? Je peux tout controller avec Javascript alors ultimement, je n'aurai pas de problème. Mais je voulais savoir s'il y avait une solution et quel navigateur gérait ce cas de la bonne façon, IE ou FF ?

Merci!!
Modifié par DarkMalow (03 Mar 2011 - 16:46)

Et en gérant ça directement avec l'attribut height de la balise img ? As-tu essayé ?

Puis que la balise img est générée dynamiquement en Javascript, je peux seulement affecter le height par Javascript, ce qui en théorie, devrait donner la même chose.

Mais même en faisant im.height = "145", ça ne fonctionne pas sous IE.

Bon... Après plusieurs tests, j'en conclue que l'erreur vient d'un endroit obscur.

Ça semble être un cas isolé qui dépend soit de la façon dont tout ça est généré en javascript, ou bien à cause du css spécial présent dans ma page.

Bref en temps normal, en ne donnant que le height, l'image reste proportionnelle même sur IE.

Misère...

Bon, ce sujet n'aidera pas beaucoup de gens dans le futur, mais au cas où:

Le bug se créait en créant dynamiquement une balise img avec document.createElement("img").
Si je faisais un document.getElementById("conteneur").innerHTML += "<img src=\"http://www.com\"" />", le bug ne se produisait plus. Mais question de programmations, j'avais besoin de créer l'image de la première façon.

En ajoutant im.style.width = "auto" en javascript, j'ai résolu le bug.