[Résolu] Icone ouvrir lien externe

Bonjour
Je souhaite mettre en place un icone "ouvrir lien externe" comme mentionné dans https://developer.mozilla.org/fr/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks
Je n'y arrive pas , j'ai bien mis l'icone dans le même répertoire que le css

a[href*="http"] {
  background: url('external-link-52.png') no-repeat 100% 0; 
  background-size: 16px 16px;
  padding-right: 19px;
  border:10px dotted black!important;
}

Après je préférerai utiliser les font fontawesome puisque la version 5.15 est intégrée dans joomla
<i class="fa-solid fa-arrow-up-right-from-square"></i>
J'ai essayé différentes choses sans succès

a[href*="http"]:after {
content: ' \f08e';
 /* content: "\f08e" no-repeat 100% 0; */
  background-size: 16px 16px;
  padding-right: 19px;  
}

Et en plus je n'aime pas le soulignement de l'emplacement. Est-ce possible de l'enlever?
(je sais, je suis exigeant)

Avec tjs le même lien https://cochanger.eu/autres/cochanger-eu c'est mieux
Modifié par HDcms (03 Jun 2022 - 16:52)

Pour le soulignement du lien :

a[href*="http"] { text-decoration: none; }

Modifié par kerlutinoec (03 Jun 2022 - 22:08)

Salut,

Alors... a priori ça ne fonctionne pas car, ton unicode :

\f08e

Ne se trouve pas dans ta font : joomla-fontawesome.min.css

Bonsoir
Merci à vous pour ces infos.
Du coup je ne sais pas si @Olivier C ou autre personne aurait une idée pour ajouter quelques fontawesome manquantes ? car j'ai le même problème non résolu sur
https://forum.alsacreations.com/topic-4-89623-1-Inidsponibilite-dune-icone-browser-fontawesome-.html ou il manque aussi une icône fontawesome dans le fichier utilisé par le cms !
Modifié par HDcms (06 Jun 2022 - 19:59)

Bonjour
Bon cela ne pouvait pas fonctionner car cet icône était une icône payante.
pas facile de le voir sur la page de l'icône.
J'en ai trouvé une gratuite qui s'affiche (voir en tête)
https://fontawesome.com/v5/icons/share-square?s=solid
J'ai mis

a[href*="http"]:after {
content: '\f14d';
  background-size: 16px 16px;
  padding-right: 19px;  
}

mais cela ne fonctionne pas. Il y a qq chose que je n'ai pas bien fais

Salut,


Tu lui donne l'unicode sans lui donner la font.
Dans un usage normal il faut mettre :

<i class="fa-solid fa-share-from-square"></i>

- le premier ici fa-solid va déterminer la font et la graisse
- le second ici fa-share-from-square va déterminer le caractère

Donc toi il te manque la font-family et la font-weight (pour la version solid)

a[href*="http"]:after {
  content: '\f14d';
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}

https://jsfiddle.net/xqwj3gkL/

Enfin "Font Awesome\ 5 Free" et pas le 6 du coup après avoir regardé ton code