Hi,
In the Windows 7 and Outlook skin for the Radgrid there is a horizontal line in the the groupheader:
-------Received from date: Saturday, March 26, 2009 --------------------------------------------
How do I achieve this line in my custom skin?
In the Windows 7 and Outlook skin for the Radgrid there is a horizontal line in the the groupheader:
-------Received from date: Saturday, March 26, 2009 --------------------------------------------
How do I achieve this line in my custom skin?
6 Answers, 1 is accepted
0
Hello HK,
The line is a horizontally repeated background image. You can see the styles in the non-embedded version of the Windows7 skin, which is available in the Skins subfolder of your RadControls installation folder (or ZIP).
.RadGrid_SkinName .rgGroupHeader
{
background:0px 8px repeat-x url('__line_image_url__');
}
You should adjust the orange strings, according to your particular skin. "8px" is the image's vertical position with regard to the group header top.
Regards,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
The line is a horizontally repeated background image. You can see the styles in the non-embedded version of the Windows7 skin, which is available in the Skins subfolder of your RadControls installation folder (or ZIP).
.RadGrid_SkinName .rgGroupHeader
{
background:0px 8px repeat-x url('__line_image_url__');
}
You should adjust the orange strings, according to your particular skin. "8px" is the image's vertical position with regard to the group header top.
Regards,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
HK
Top achievements
Rank 1
Rank 1
answered on 06 Apr 2010, 03:59 PM
Hi Dimo, and thanks for your answer.
With your code a get a horizontal line in the group header, but I don't want the line under the text in the group header. How can I make the line "to start" after the text in the group header?
//HK
With your code a get a horizontal line in the group header, but I don't want the line under the text in the group header. How can I make the line "to start" after the text in the group header?
//HK
0
Hi HK,
There is a background color defined for some group header inner elements. This background color "overlays" the background image.
.RadGrid_SkinName .rgGroupHeader td p ,
.RadGrid_SkinName .rgGroupHeader td div div
{
background: some color ;
}
All the best,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
There is a background color defined for some group header inner elements. This background color "overlays" the background image.
.RadGrid_SkinName .rgGroupHeader td p ,
.RadGrid_SkinName .rgGroupHeader td div div
{
background: some color ;
}
All the best,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
HK
Top achievements
Rank 1
Rank 1
answered on 06 Apr 2010, 04:49 PM
Thank you, that works perfect!
//HK
//HK
0
HK
Top achievements
Rank 1
Rank 1
answered on 17 May 2010, 11:14 AM
Hi again,
This works perfect in IE8 and Firefox, but in IE7 the background color doesn't "overlay" the background image. Is there a way to solve this also for IE7?
//HK
This works perfect in IE8 and Firefox, but in IE7 the background color doesn't "overlay" the background image. Is there a way to solve this also for IE7?
//HK
0
Hi HK,
The following demo works as expected in IE7 -
http://demos.telerik.com/aspnet-ajax/grid/examples/groupby/outlookstyle/defaultcs.aspx
Maybe there is something else on your page, which triggers the unwanted effect? Sending a demo in thsi case will be appreciated.
Sincerely yours,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
The following demo works as expected in IE7 -
http://demos.telerik.com/aspnet-ajax/grid/examples/groupby/outlookstyle/defaultcs.aspx
Maybe there is something else on your page, which triggers the unwanted effect? Sending a demo in thsi case will be appreciated.
Sincerely yours,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.