This is a migrated thread and some comments may be shown as answers.

Help with Grid Header formatting

5 Answers 90 Views
Grid
This is a migrated thread and some comments may be shown as answers.
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!

5 Answers, 1 is accepted

Sort by
0
sitefinitysteve
Top achievements
Rank 2
Iron
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 :)
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...
0
sitefinitysteve
Top achievements
Rank 2
Iron
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.
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
Dimo
Telerik team
answered on 21 Oct 2010, 01:45 PM
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
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
Tags
Grid
Asked by
Luke Kasper
Top achievements
Rank 1
Answers by
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
Luke Kasper
Top achievements
Rank 1
Dimo
Telerik team
Share this question
or