Archived topic
Dashicon not displaying in Firefox and Chrome
9 replies · Started by Samuel on September 17, 2020
Hello,
I have a problem with a simple Dashicon I put in a button : it's not displaying well on Firefox and Chrome. You can see it here : https://monvoyageencolombie.com
Here is the the CSS I use to do so. Is there any trouble with it ? Any clue on what could cause problem with Dashicon display ? I thought it was like the most standard icons on the market...
.wp-block-button :before {
content: "\f504";
-webkit-font-smoothing: antialiased;
font: normal 25px/1 'dashicons';
display: inline-block;
color: #393939;
height: 30px;
margin-right: 13px;
position: relative;
vertical-align: middle;
width: 30px;
}Hi there,
Is that a FontAwesome icon?
How are you loading it?
Hi Leo,
As it's mentioned in title of my request and in my message, it's a Dashicon.
Sorry missed that.
Does it help if you clear and disable the caching plugin first?
Also seeing a bunch of console errors:
https://www.screencast.com/t/CrNSeblH
No it's not caching plugin.
I don't think any of these errors are causing the issue.
Any other idea ?
Hmm not really.
Can you try disabling all plugins to eliminate any conflicts?
What if use a twenty series default theme? Does the icon shows?
It's not a plugin conflict either (tested)
Switch to default theme just for that seems a bit too much no ? I can give it a try but I'm pretty sure it's not going to solve anything.
Do you have a possibility to reproduce the issue using my snipet on your side ?
Switching to the default theme would determine if it's a theme issue or not.
What if you try the solutions in this post?
https://generatepress.com/forums/topic/dashicons-not-working-with-generatepress-theme/
Here you go... that was it !
Adding this to function.php
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
wp_enqueue_style( 'dashicons' );
}Thanks !
No problem :)
