[RESOLU] Background-position sur element inline sur 2 lignes

Bonjour,

Ca fait des années que je m'abreuve du forum mais voila mon premier post (je suis vraiment bloqué).

J'ai un problème d'affichage d'une puce que je mets en background de mes liens :

#monbloc a {
	padding-right: 8px;
	background: transparent url(../img/puce02.gif) no-repeat right;
}

Sur firefox pas de souci. Sur IE7, quand le lien s'affiche sur 2 lignes (car le conteneur est étroit), la puce s'affiche à droite et au milieu du bloc a. Quoi que je fasse (right bottom, ...), avec IE l'affichage n'est pas satisfaisant.

Si vous avez une idée je suis preneur.
Url de test : http://www.inrezo.com/_raph/puce.html

Un grand merci.
Raph
Modifié par snow_raph (25 Feb 2008 - 10:07)

Bonjour et bienvenu sur le Forum en tant que membre actif

Ton problème ne pourrait-il pas venir du fait que tu spécifies la position horizontale en omettant la position verticale de ta puce ?

#monbloc a {
  padding-right: 8px;
  background: transparent url(../img/puce02.gif) no-repeat [#blue]top[/#] right;
}

Malheureusement ce n'est pas suffisant
J'ai mis à jour l'exemple avec ta solution (http://www.inrezo.com/_raph/puce.html)
Merci en tout cas !

Bonjour,

C'est un bug d'IE connu. Pas de correctif à ma connaissance.

Solution: passer par une image dans le code HTML:

<a href="...">Bla bla bla bla <img src="puce.png" alt="" /></a>

Si on ne souhaite pas alourdir le code HTML, pour de gros projets, on pourra envisager de passer par Javascript pour insérer l'image, par exemple.

C'est dommage mais c'est comme ça.
Merci en tout cas pour cette réponse claire.