Sélecteur CSS particulier

Version imprimable

20/02/2007, 12h19
pataluc

Sélecteur CSS particulier
Bonjour,

je cherche un sélecteur CSS qui me permette de sélectionner les balises a ne contenant pas d'image...

je m'explique, j'utilise (sous firefox) l'extension stylish qui me permet de rajouter des styles aux pages que je visite. j'ai un script qui me permet d'afficher une enveloppe apres les adresses mails:
Code:

1 2 3 4 a[href^="mailto:"]:after { content: url("data:image/png;base64,iVBORw0K...K5CYII="); padding-left:4px; }
et je voudrais faire en sorte que ce style ne s'applique pas au blaise qui contiennent déja une image... j'ai essayé avec le sélecteur :not() mais je n'ai pas réussit a obtenir ce que je voulais; et de même je ne vois pas où je peux aller avec les sélecteur du type child, ni même en faisant un truc du genre
Code:

1 2 3 a[href^="mailto:"]:after img { content:none; }
car ce style s'applique du coup a la balise img et non a...

qqun aurait il une idée de la bonne méthode pour ce que je cherche à faire? (je précise que vu que c'est pour une extension sous FF, je me moque de la compatibilité IE...)

Merci bcp,

Luc
20/02/2007, 16h41
arnobase
Dans la meme logique ne serait-ce pas
Code:

1 2 3 4 a[href^="mailto:"][img]:after { content:none; }
:question::question:
20/02/2007, 17h12
pataluc
Citation:
Envoyé par arnobase

Dans la meme logique ne serait-ce pas

Code:

1 2 3 4 a[href^="mailto:"][img]:after { content:none; }

:question::question:
il me semble que la notation [] est pour les attributs, alors que la c'est une balise fille... j'ai eu un faux espoir en croyant que ca marchait, mais en fait ca ne me met plus du tout mon contenu...
20/02/2007, 23h09
arnobase

:oops: j'avais compris de traviole ce que tu voulais désolé... je vois pas mieux en fait
22/02/2007, 12h25
pataluc

je re-précise un peu ce que je veux faire...

grâce a ce code et au sélecteur ":after", j'obtiens ce résultat:

http://pommedefennec.free.fr/divers/a_sansimg.png

mais le problème, c que qd un site a déja une img, ca fait pas jojo:

http://pommedefennec.free.fr/divers/a_avecimg.png

j'espere que ca peut aider... ^^

merci,
Luc

Tu n'as qu'à utiliser des classes pour tes liens.

Code:

1
2
<a href="mailto" class="mailtotexte">Texte</a>
<a href="mailto" class="mailtoimg"><img .. /></a>

Code:

1
2
3
4
a.mailtotexte:after {
  content: url("data:image/png;base64,iVBORw0K...K5CYII=");
  padding-left:4px;
}

22/02/2007, 12h49
pataluc

Citation:

Envoyé par Bisûnûrs

Tu n'as qu'à utiliser des classes pour tes liens.

en fait c'est pour un style chargé par Stylish qqusoit les pages que je visite, ce n'est pas pour un site que je développe. Je ne peux donc agir sur les classes...
22/02/2007, 13h54
MasterOfChakhaL
salut,

Je ne pense pas que ce soit possible directement en css.
Cela dit, je n'ai pas essayé mais p'tet qu'en bidouillant un peu tu peux arriver a quelque chose.
Code:

1 2 3 4 a[href^="mailto:"]:after { content: url("data:image/png;base64,iVBORw0K...K5CYII="); padding-left:4px; }
Comme tu l'as déjà fait, ca te permet d'ajouter l'image...
Ensuite, il faut masquer l'image que tu ajoutes quand une image et présente.
Code:

1 2 3 a[href^="mailto:"] img { margin-right: -largeur de l'image et du padding-left; }
Si l'image du lien a déjà un margin, ca ne va pas le faire mais bon...
Il te faudra aussi jouer avec les z-index je pense.