CSS: replace font icons with text

I have a header where buttons are displayed as font icons. I want to replace them with simple text for each button. Here’s my code right now, how would I go about doing that? I hope I’m getting this right

<li class="wp_dashboard_tab_content_header_%1$s">
    <a href="#tab_wp_dashboard_tab_content_header_%1$s"
      id="wp_dashboard_tab_content_header_%1$s" 
      class="wp_dashboard_icon_header_%1$s wp_dashboard_icon">
        <span></span>
    </a>
</li>

In my CSS file I have, for example

.wp_dashboard_icon_header_home:before {
  content: "e653";
}

Related posts

1 comment

  1. You need to add to the specific element font-family. That’s because by default, element who need to be render as font-icon has font-family which contains icon but no letters or numbers.

    Try to set

    .wp_dashboard_icon_header_home:before {
       font-family:Arial;
       content: "Some text";
    }
    

Comments are closed.