[Solved] Horizontal scroll - display of the grid is disrupted

[Ro]

Hi, 

I have a grid with horizontal scroll.

Whenever I use the scroll,  the display of the grid is disrupted:
The first column of the header is cut in the middle (as you can see in the attached image) -
the content looks good but doesn't fit to the header.

What can I do about this?

Thanks!

 

The display of the grid is disrupted

The display of the grid is disrupted

[Patrick | Technical Support Engineer, Senior]

Hello Ro,

Take a look at this sample which includes a grid with a horizontal scroll.  When I scroll to the right, it works as expected.  

I recommend you to update the attached grid or create a new dojo which demonstrates the behavior of your Kendo Grid and reply back with the results. 

I look forward to your response.

Regards,
Patrick
Telerik

 

 

[Ro]

It's happen when the vertical scroll is auto or hidden

Please check this dojo

http://dojo.telerik.com/Univi

 

[Patrick | Technical Support Engineer, Senior]

Hi Ro,

Take a look at this demo with a solution to your issue.    By using applying the following CSS, the headers will align when you scroll the horizontal bar:

   <style>
    #grid .k-grid-content{
    overflow-y : auto;
    }
    #grid .k-grid-header {
    padding: 0 !important;
}
  </style>

 
For more details regarding the subject, see this documentation called "Remove the vertical scrollbar" just before Locked Columns section.

Hope this helps!

Regards,
Patrick
Telerik