White space above RadGrid Scrollbar

[Vargis]

Hi
Firstly I am facing so many rendering problems in IE8 (We are ignoring IE7 so no need to support in that bug browser).

Here I am attaching an image please refer.
To remove this white space I had try this property in CSS

#rgVessel_GridHeader, .rgHeaderDiv {margin-right:0!important}

It works but the alignment of Grid vertical line disturbed. Is it right hack for removing this white space? Then
How we can restore the Grid Vertical Lines.?

Please help us.
Thanks in Advanve

vargis
[e-mail]

[Shinu]

Hi,

With reference to this forum thread, I am afraid that there is no way to avoid the alignment issue which is cause by the Css code you used. The only possible workaround for this problem is to create a custom background image, which looks like the header background and set it as a background of the outer RadGrid <div>.

Thanks,
Shinu

[Jayesh Goyani]

Hello,

As per shinu's Comments there is no way to avoid but please try with below code snippet.

<style type="text/css">

.RadGrid

 {

  background-color: Gray !important;  // Your skin color


 }

</style>

Thanks,
Jayesh Goyani

[Vargis]

But it will not works fine in the telerik theme change :(

[Eric Bradley]

Hi, I'm also having the same problem using telerik Office2010Blue. I've looked at the online demo and it also has the same issue.

I've been able to correct the issue when the page loads using below style but problem continues when paging. It seems like a styling issue within the grid control and not related to how we style the our page.

.rgHeaderDiv

{

 

overflow:visible !important;

}

 

[Vargis]

White space above RadGrid Scrollbar

Here is my solution Boss :)

.rgHeaderDiv
{
margin-right:0!important;
padding-right:17px!important;
}

Dont try this in your main CSS. Paste it individually in all pages you want to treat the
white space above RadGrid Scrollbar

[Eric Bradley]

Perfect, that solved the problem with paging as well, thanks

[Elena]

This solves our problem with misaligned headers and columns while scrolling horizontally in IE, but breaks the alignment in Firefox. Any suggestion will be appreciated.

[Venelin]

Hi all,

I wouldn't recommend to use such styles like

#rgVessel_GridHeader, .rgHeaderDiv {margin-right:0!important}

or

.rgHeaderDiv
{
margin-right:0!important;
padding-right:17px!important;
}

because they will break the grid's layout. The margin above the scroll is calculated dynamically and this rule with !important will break this functionality. Don't do it.

The white gap above the grid was due to a rendering design limitation in the older versions of telerik rad controls. In order to workaround this you have to use the approach that Shinu referred to. If you bother about skin changing runtime you can easily attach a specific for every skin class programmatically in code-behind and change it depending on the skin.

Regards,
Venelin
Telerik