
Luke Kasper
Top achievements
Rank 1
Luke Kasper
asked on 19 Oct 2010, 06:10 PM
All,
I'm having an issue with my RadGrid header row. The headers for the rows appear correctly sized, however for any screen real estate to the right of my furthest right header, I get funky results. I attached a screenshot.
I think the fix will probably be something to the grid.css file, but I just can't seem to figure it out. Is there something I'm missing on this?
Thank you!
I'm having an issue with my RadGrid header row. The headers for the rows appear correctly sized, however for any screen real estate to the right of my furthest right header, I get funky results. I attached a screenshot.
I think the fix will probably be something to the grid.css file, but I just can't seem to figure it out. Is there something I'm missing on this?
Thank you!
5 Answers, 1 is accepted
0

sitefinitysteve
Top achievements
Rank 2
Veteran
answered on 20 Oct 2010, 05:42 AM
This public anywhere to look at?
Have you tried combing through the CSS styling on that element using Firebug?...that's where I'd start :)
Have you tried combing through the CSS styling on that element using Firebug?...that's where I'd start :)
0

Luke Kasper
Top achievements
Rank 1
answered on 20 Oct 2010, 02:55 PM
Unfortunately, no, it's not public anywhere and I'm really limited on what I can show.
I've attached a screenshot of what IE Developer Toolbar shows for the style of the header bar. Hopefully this helps...
I've attached a screenshot of what IE Developer Toolbar shows for the style of the header bar. Hopefully this helps...
0

sitefinitysteve
Top achievements
Rank 2
Veteran
answered on 20 Oct 2010, 02:57 PM
Ahhh, IE Developer toolbar is your problem :)
Install Firefox, then Install the Firebug addon...you'll find the bad style in minutes compared to IE Dev Bar. Not even in the same ballpark in terms of debugging.
Install Firefox, then Install the Firebug addon...you'll find the bad style in minutes compared to IE Dev Bar. Not even in the same ballpark in terms of debugging.
0

Luke Kasper
Top achievements
Rank 1
answered on 20 Oct 2010, 03:11 PM
Here's the Firebug output. Funny enough, it shows correctly in Firefox by default, but I was able to replicate it. Is this helpful?
0
Hello Luke,
When using scrolling with static headers, there is some empty space above the vertical scrollbar. By default it is filled with a background image, which is aligned if the header row is single-lined. Unfortunately, the background image cannot expand automatically to match any header row height.
In your case you can do one of the following:
1) Replace the background image with the one intended for double-lined header rows by setting
<telerik:RadGrid CssClass="rgTwoLines" />
This will work if the header font size and vertical paddings have not been changed.
2) Remove the background image by setting
<telerik:RadGrid CssClass="rgNoScrollImage" />
3) Create and apply a custom background image, adjusted to match the header row height in your specific scenario. The custom image should be set like this:
ASPX
<telerik:RadGrid CssClass="MyCustomScrollImage" />
CSS
div.MyCustomScrollImage .rgHeaderDiv
{
background:0 0 repeat-x url("...............") ;
}
Best wishes,
Dimo
the Telerik team
When using scrolling with static headers, there is some empty space above the vertical scrollbar. By default it is filled with a background image, which is aligned if the header row is single-lined. Unfortunately, the background image cannot expand automatically to match any header row height.
In your case you can do one of the following:
1) Replace the background image with the one intended for double-lined header rows by setting
<telerik:RadGrid CssClass="rgTwoLines" />
This will work if the header font size and vertical paddings have not been changed.
2) Remove the background image by setting
<telerik:RadGrid CssClass="rgNoScrollImage" />
3) Create and apply a custom background image, adjusted to match the header row height in your specific scenario. The custom image should be set like this:
ASPX
<telerik:RadGrid CssClass="MyCustomScrollImage" />
CSS
div.MyCustomScrollImage .rgHeaderDiv
{
background:0 0 repeat-x url("...............") ;
}
Best wishes,
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