happyscone Posted September 16 Share Posted September 16 (edited) Site URL: https://www.jessleclerc.com/ I want to change the second link, a hyper-link icon, to an envelope icon since it is a mailto: link. I tried a few different strategies with no success. The first option, I tried changing the icon itself to a different icon. The second approach, I uploaded FontAwesome into the CSS and tried targeting the icon this way. Example code: .sqs-social-links .sqs-social-link a[href^="mailto:"]::before { content: '\f0e0'; /* Unicode for Mail icon */ font-family: 'FontAwesome' !important; font-size: 24px; display: inline-block; line-height: 1; } My assumption might be because I am using the knock-out styling and not able to target it correctly. Edited September 16 by happyscone added context Link to comment
happyscone Posted September 16 Author Share Posted September 16 Also just realized, the mailto:example@gmail.com doesn't actually work.. maybe I need a completely different solution for this :) Link to comment
Solution Web_Solutions Posted September 16 Solution Share Posted September 16 4 hours ago, happyscone said: Also just realized, the mailto:example@gmail.com doesn't actually work.. maybe I need a completely different solution for this 🙂 You don't need to add mailto: Just add it like the image instruction If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks MD Rofik Website Designer and Digital Marketer ☕Am I helpful? Want to offer me a coffee? ✉ Send me a message if needed any help. I'll try to reply as soon as possible. Link to comment
happyscone Posted September 16 Author Share Posted September 16 Ahh thank you! So simple, don't know how I missed that :) Appreciate it - cheers! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment