[Solved] Changing Font-Size for Office2007 Skin

[Joe]

Hello,

I want to know how to change the font-size of the Office2007 Skin.  The current font-size is a little to large and would like to change the size.

How is this done?

Thanks,
Joe

[Dimo]

Hi Joe,

The CSS rule, which sets the font styles for RadGrid Office2007 is:

.RadGrid_Office2007,
.RadGrid_Office2007 .rgMasterTable,
.RadGrid_Office2007 .rgDetailTable,
.RadGrid_Office2007 .rgGroupPanel table,
.RadGrid_Office2007 .rgCommandRow table,
.RadGrid_Office2007 .rgEditForm table,
.RadGrid_Office2007 .rgPager table,
.GridToolTip_Office2007
{
    font:12px/16px "segoe ui",arial,sans-serif;
}


If you want to override it, you need to supply a CSS rule with selectors of greater specificity, e.g. :


div.RadGrid_Office2007,
div.RadGrid_Office2007 .rgMasterTable,
div.RadGrid_Office2007 .rgDetailTable,
div.RadGrid_Office2007 .rgGroupPanel table,
div.RadGrid_Office2007 .rgCommandRow table,
div.RadGrid_Office2007 .rgEditForm table,
div.RadGrid_Office2007 .rgPager table,
span.GridToolTip_Office2007
{
    font:14px/18px "segoe ui",arial,sans-serif;
}


On a side note, please read the following article, which contains some useful information about how to get familiar with and override embedded skins:

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


Greetings,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Joe]

Hi,

I overrode this however the change only changed for about 50% of the grids.  Not sure what is happening.

Thanks,
Joe

[Dimo]

Hello Joe,

There are two possible reasons for this:

1) Some of your RadGrids have a different skin, not Office2007

2) You have some custom CSS styles in the website, which have higher specificity and cannot be overridden with the provided CSS rules (see the link in my previous post).

Since option (1) would be pretty obvious, I suggest that you inspect your web pages with Firebug in order to trace the CSS styles that interfere.

All the best,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.