28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

voilà, je veux mettre une icône après un lien, pour différencier mes liens externes des externes.
J'utiliserais bien la pseudo-classe :after spécialement dédiée à ce type d'usage, seulement ce n'est pas supporté par "certains navigateurs"...
(hein? je radote?)
Bon donc, en toute logique je me fais une classe :
.linkExt{
background:url(icone.gif) top right no-repeat;
padding-right:15px;
}

Bon comme d'habitude sous FF, pas de problème.
Sous IE, tout se passe bien si le lien est sur une seule ligne. Mais dès qu'il se trouve sur 2 lignes (ou plus), le background n'est plus du tout bien placé.
Il considère que le coin "top right" est sur la première ligne du lien, en haut à droite.

Quelqu'un aurait une idée pour pallier à cela ?

Merci à tous
Modifié par yyoupla (07 Jun 2006 - 14:32)
Salut
yyoupla a écrit :

Il considère que le coin "top right" est sur la première ligne du lien, en haut à droite.

Et que devrais t'il faire d'autre ?

Ou alors il nous manque des info !...

A+
Modifié par gege71 (05 Jun 2006 - 17:50)
Eh bien je voudrais que l'image se trouve à la fin du lien.
Voilà ce que ca donne avec FF : tout va bien.
upload/3951-linkFF.gif
Et maintenant avec IE :
upload/3951-linkIE.gif

Pour info, le code simplifié:
<html>
<head>
<title>title</title>
<style type="text/css">
#cont{
width:150px;
border:1px solid #000;
}
.linkExt{
background:url(icon.gif) right 7px no-repeat;
padding-right:10px;
}
</style>
</head>
<body>
<div id="cont">
Blabla blablabla <a href="#" class="linkext">ceci est le lien</a> blabla
</div>
</body>
</html>

Modifié par yyoupla (05 Jun 2006 - 18:31)
salut,

un truc tout bête... est-ce que ca ne viendrait pas du fait que ta class se nomme .linkExt et dans ton code tu la nomme linkext (avec un "e" minuscule) ???
hé non Smiley sweatdrop
c'est juste une erreur de recopiage du code sur le forum Smiley langue

cela me parait quand même étonnant que ça ne soit pas possible. (à part avec :after, bien entendu...)
A priori il place ton "truc" en haut à droite, mais si tu lui dis de le placer en bas à droite, cela ne règlerai pas le problème ?!

J'avoue ne pas savoir non plus, mais c'est peut être une piste à exploiter : chercher en tout premier lieu à le placer "en bas" puis "à droite".