Last Updated: 17 Aug 2018 14:35 by Vasssek
Created on: 19 Jan 2017 11:22
Category: Button
Type: Bug Report
Custom font icons are not rendered in PrimaryIcon and SecondaryIcon of RadButton with Classic
Common scenario is to use PrimaryIconCssClass and SecondaryIconCssClass to decorate custom icons. Common situation is using bootstrap's classes for the glyphicons.

In order to workaround this you can use custom CSS rules and define the expected content properties for the before elements. This is an example with bootstrap icons ( 

    .rbSecondaryIcon.glyphicon-filter:before {
        content: "\e138";

<telerik:RadButton ID="RadButton2" runat="server" 
    Text="Filter" ButtonType="SkinnedButton" 
    Icon-PrimaryIconCssClass="glyphicon glyphicon-filter" >

Posted on: 17 Aug 2018 14:35
Hi, this issue is not completed. I have similar problem. Check this thread:
Posted on: 07 Aug 2018 22:00
UI for ASP.NET AJAX R2 2018 SP1 (version 2018.2.710)
problem still exists! I guess they don't care because it's marked "completed".
Posted on: 27 Feb 2018 14:25
UI for ASP.NET AJAX 2018.1.117.45
Still the same problem. .rbPrimaryIcon:before, .rbSecondaryIcon:before { content: ''; } is the culprit. It overrides the content of the FontAwesome :before elements that put icons on the screen.
Posted on: 08 Aug 2017 17:57
FYI, the Rick Atkinson comments are mine too, did not have my own account at the time.
Posted on: 08 Aug 2017 17:55
any update to this?  problem still exists after several new releases. Are we supposed to be using another method (RadButton ContentTemplare)?
Posted on: 30 Jan 2017 17:33
Attached is a screenshot of my issue.  I have been unable to override the .rbPrimaryIcon:before content setting.  It was not there in the prior version.
Attached Files:
Posted on: 30 Jan 2017 16:33
I have this same issue with the font awesome icons.  the .rbPrimaryIcon:before, .rbSecondaryIcon:before { content: ''; } is the culprit.  Why was this added?  How can it be removed?  Don't want to have to touch 200 buttons to change.