radgrid header alignment Problem when implementing grouping with static header and Scrolling

[Manoj]

 I have Grid with
*Scrolling
*Static header
*Number of columns  - 35
*Browser : ie 7

I got the header alignment Problem when implementing grouping using GroupByExpressions.

Please see the file attached.

[Angel Petrov]

Hi Manoj,

I tried to reproduce your issue but to no avail. I am attaching a simple project where static headers and scrolling are enabled for the grid, also GroupByExpressions property is set and it behaves correctly. Give it a try and see what is the difference in your case.

Kind regards,
Angel Petrov
the Telerik team

[Manoj]

Hi Angel,

I tried with your code.It works fine.

The problem is..
You have used  Skin="Vista"

I am using Default skin and written the bellow CSS to provide border line to the grid.

div.RadGrid_Default .rgHeader, div.RadGrid_Default th.rgResizeCol, div.RadGrid_Default .rgFilterRow td, div.RadGrid_Default .rgRow td, div.RadGrid_Default .rgAltRow td, div.RadGrid_Default .rgEditRow td, div.RadGrid_Default .rgFooter td, div.RadGrid_Default th.rgSorted
{
border-top: 1px solid silver;
border-left: 1px solid silver;
}

Here is the problem.
can you please help me with the sample project with static header,Scrolling,Default skin and Border lines.

Thanks in advance.

[Angel Petrov]

Hello Manoj,

I have replicated this issue and it is due to incorrect usage of the box model and it only occurs in IE7. You could workaround this issue by adding the following CSS:

div.RadGrid_Default .rgGroupHeader td
       {
           border-left: 1px solid #d9d9d9;
       }

This will add an additional pixel to the column group that will correct the alignment.

Kind regards,
Angel Petrov
the Telerik team

[Manoj]

Hi Angel,
 
Now it is working fine.

Thank you so much.