Hallo!

Joomla: 5.1.0
Framework Version: 3.0.14
Template: Time
Template Version: 1.3.17
Uikit: 4.0.5.
Ich bin noch in der Entwicklungsphase; könnte einen Link und PW nur per PM übermitteln.

Ich möchte einem Link zu einer Telefonnummer (<a href="tel:0123456789">…) per Pseudo-Element ein Telefonhörer-Icon voranstellen. Z. B. , "\f879" (fa-phone-alt).
Dieses wird mir z. B. in den Kontaktinformationen angzeigt, wenn ich diese unter Miscellaneous --> Contact Information aktiviere und als Modul anzeigen lasse.
Als content der Pseudo-Klasse hingegen, wird nur das Zeichen für ein nicht gefundenes Zeichen des fonts angezeigt.
Für fa-envelope hingegen, "\f0e0", funktioniert es.

Hier mein CSS:
Mir ist aufgefallen, dass ich beispielsweise einen per Framework nirgendwo ausgewählten Google-Font, einem Element auch nicht zuweisen kann.
Weise ich den Font hingegen z. B. der Überschrift h6 zu (ohne sie tatsächlich zu benutzen), wird der Font auch per Klasse gefunden.
Leider funktioniert das nicht, wenn ich die Kontaktinformationen verwende.
Woran könnte das liegen?

Vielen Dank.

Fügen Sie zum test einmal diesen Code wahlweise in ein eigenes Modul oder einen Beitrag ein:
<p><span style="font-size: 12pt;"><i class="fa-brands fa-twitter fa-bounce"></i></span></p>

Wird das Icon angezeigt?

Ja. Wird angezeigt und hüpft.

Yep, dann scheint die Darstellung ja grundsätzlich zu funktionieren.
Wir greifen auf diese Icons zurück:
fontawesome.com/search?q=facebook&o=r

Naja. Die Darstellung ansich funktioniert. Das habe ich ja in dem Bild aus dem ersten Beitrag gezeigt.

Aber eben nicht als Wert für content als Pseudo-Element.

Während z. B. …

a[href^="mailto:"]::before {
content: "\f0e0";
}

funktioniert.

Sehr merkwürdig.

Echt merkwürdig.
Bin ich jetzt auch überfragt...