Default font

[Paula]

I am currently using many of the rad controls in my application, RadMenu, RadGrid, RadTabStrip, RadPanel, RadDock all of which have the default skin applied.  I would like to change the font that is being used but I cannot find how to do this.  I did find other posts that say that there has to be an override in the css for each control but not the format to use to override the font.  I was trying to use .RadMenu_Default { font-family: arial,Helvetica,sans-serif !important; } with no luck, I also tried .RadMenu, .RadGrid, .RadGrid_Default.... 

Can you please help?  Font changes should not be this complicated!

Paula

[Dimo]

Hello Paula,

Indeed, font changes are not complicated, but you need to override the correct CSS rule. Setting a font style to the control's wrapper does not necessarily work, because the font styles in the skin are usually set on some inner elements. So you need to inspect the HTML output and CSS styles with Firebug and use the correct CSS selectors. Using "!important" is not required if you set a high-ehough specificity.

http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx

For example, the RadGrid skin font styles (for the Default skin) can be overridden like this:

div.RadGrid_Default,
div.RadGrid_Default .rgMasterTable,
div.RadGrid_Default .rgDetailTable,
div.RadGrid_Default .rgGroupPanel table,
div.RadGrid_Default .rgCommandRow table,
div.RadGrid_Default .rgEditForm table,
div.RadGrid_Default .rgPager table,
span.GridToolTip_Default
{
     font-size:14px;
     font-family: verdana,sans-serif;
}


You can also inspect the non-embedded versions of the RadControls skins, which are located in the /Skins/ subfolder of your RadControls installation (or ZIP file).

Kind regards,
Dimo
the Telerik team