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

Grid Column Resize Bug (Chrome)

5 Answers 255 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Dan
Top achievements
Rank 1
Dan asked on 23 Oct 2014, 02:26 PM
Hi,
We've found that resizing columns in Chrome causes a visible glitch in certain circumstances.
We can reproduce the issue on the Kendo Grid demo page:

1) Open the Demo site in Chrome: http://demos.telerik.com/kendo-ui/grid/column-resizing
2) Reduce the width of a few columns
3) Several columns will 'glitch' and overlay

I have attached an example screenshot.

Please can you investigate and/or propose a solution/workaround?

Thanks,
Anthony

5 Answers, 1 is accepted

Sort by
0
Dan
Top achievements
Rank 1
answered on 23 Oct 2014, 02:30 PM
I've just noticed that the glitch only appears after the second column resize. 
0
Dimo
Telerik team
answered on 23 Oct 2014, 03:18 PM
Hi Anthony,

This is a bug in Chrome 38:

https://code.google.com/p/chromium/issues/detail?id=423352

I am afraid we can't offer any workarounds at this point and hope the problem will be fixed in the browser.

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Bridge24
Top achievements
Rank 1
answered on 19 Nov 2014, 09:23 PM
We have this trouble too only on chrome when we resize columns...

It seems to be an old "known issue" of chrome, as described here: 
http://stackoverflow.com/questions/11002195/chrome-does-not-redraw-div-after-it-is-hidden

We fixed it using that CSS trick:

.k-header {
    -webkit-transform: scale3d(1,1,1);
}
0
Dimo
Telerik team
answered on 20 Nov 2014, 08:50 AM
Hi Daniel,

Yes indeed, using CSS transform seems to resolve the issue. Thank you very much for your contribution!

.k-grid tr
{
   -webkit-transform: scale3d(1,1,1);
}


It appears that the following CSS rule fixes the glitch as well:

.k-grid th,
.k-grid td
{
    -webkit-transform: translateZ(0);
}


Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Rahulkumar
Top achievements
Rank 1
answered on 14 May 2015, 03:06 PM
Awesome !!
Tags
Grid
Asked by
Dan
Top achievements
Rank 1
Answers by
Dan
Top achievements
Rank 1
Dimo
Telerik team
Bridge24
Top achievements
Rank 1
Rahulkumar
Top achievements
Rank 1
Share this question
or