[Solved] Odd rows color-out of the screen

[idwaikat]

Hi all

I have a wide grid, which contains more than 15 columns, about 10 of them appears on the screen and the rest goes outside screen border, I set the skin of the grid to black (the page back color is white), and I don't need a scroll bars...

The problem is that the background color of the part that goes outside the screen (of the odd rows only), that backcolor is white

(please check this image:   http://img244.imageshack.us/img244/5471/rowcolor.png  )



Actually I searched the forum, but I didn't find a solution.

PS: If using horizontal scroll bar only fixes the problem please provide me the solution, only I can use horizontal scroll bar without vertical scroll bar (I am using paging)...

Waiting your response..

Regards

[Princy]

Hello,

I am not sure as to what might be causing this issue on your grid. However to display only the horizontal scroll and avoid the the vertical scroll on your grid you can try setting the height of the records in the grid such that it does not exceed the ClientSettings -> Scrolling -> ScrollHeight scroll setting.  For more information on this refer the following demo:
Scrolling

Thanks
Princy.

[idwaikat]

But the grid, near the pages numbers, contains a combo box which changes the number of rows (10, 20,50), which changes the height of the grid records..... your demo does not handle this case... right??

[Dimo]

Hi idwaikat,

The problem is caused by standard browser behavior - RadGrid is a <table> inside a <div>. The <div> has a width of 100% by default, so it is as wide as the browser window in your case. However, tables normally expand to enclose their content, which can result in the RadGrid table being wider than the RadGrid div. That's why the background is lost in the right part of RadGrid (it is set to the div).

A possible solution is to:

1. Set larger width in pixels for RadGrid.
or
2. float the RadGrid with style="float:left" and clear the float after it with

<div style="clear:both"><!-- --></div>

or

3. Enable RadGrid scrolling and static headers. In this case, please remove the RadGrid height and set ScrollHeight (in ClientSettings > Scrolling), which will be large enough so that you don't need a vertical scrollbar for the control.


You can hide the page size combobox at runtime like this:

http://www.telerik.com/community/forums/aspnet-ajax/grid/grid-skin-for-vista-and-page-size-combobox.aspx#788526


Greetings,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.