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

column locking row heights not matching

29 Answers 742 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Bill
Top achievements
Rank 1
Bill asked on 01 Apr 2014, 03:36 PM
Kendo UI Grid Forum,

Kendo UI Grid just came out with the column locking functionality.  When column locking is enabled, the heights of the nonlocking rows don't line up after the first 2 rows -  see the attached file.  The locked column height dictates the height of all of the other rows because it has the most information.   Without column locking the row heights function just fine.  With column locking there's a mismatch in row heights.  Do you have any recommendations regarding this issue?   

Thanks for your help, Netfactor



29 Answers, 1 is accepted

Sort by
0
Nikolay Rusev
Telerik team
answered on 02 Apr 2014, 06:03 AM
Hello Bill,

We are aware of this issue. It was addressed in the recent internal build. You can downloaded from your account. Please give it a try and let me know whether you are still seeing the same behavior.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Bill
Top achievements
Rank 1
answered on 02 Apr 2014, 05:16 PM
Nikolay,

We're currently using version 2014.1.318 which is the same as the current internal release and there are issues with the rows lining up.

Bill
0
Nikolay Rusev
Telerik team
answered on 03 Apr 2014, 08:18 AM
Hello Bill,

2013.1318 is the Q1 2014 official release of Kendo UI. You should download latest internal build for Kendo UI from your account.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Bill
Top achievements
Rank 1
answered on 03 Apr 2014, 05:11 PM
The link mentioned shows version 2014.1.318 in the dropdown for the latest build for UI for ASP.NET MVC and 2014.1.318 for Kendo UI Web.  Let me know where to find later builds...
0
Bill
Top achievements
Rank 1
answered on 04 Apr 2014, 01:24 PM
We're currently using build 2014.1.318 and running into the issue with columns not lining up - see the attached screen shot.  

Is there a newer build out that resolves the problem of the rows lining up between the locked and unlocked columns?  
0
Kiril Nikolov
Telerik team
answered on 04 Apr 2014, 03:15 PM
Hello Bill,

On the screenshot that you shown the build in the link is 2014.1.328 and not 2014.1.318. Did you try using the .328 version? If not please download it and give it a try.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Bill
Top achievements
Rank 1
answered on 07 Apr 2014, 01:54 PM
Version 2014.1.328 resolved the issue.  The rows are now lining up.  Thanks for your help.


0
Kiril Nikolov
Telerik team
answered on 07 Apr 2014, 02:50 PM
Hi Bill,

I am glad to hear that the issue is resolved.

In case you have any further questions, please do not hesitate.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Oscar
Top achievements
Rank 1
answered on 14 Apr 2014, 12:58 PM
Hi Nikolay,
Do you have any fiddle/jsbin sample to check if this last internal build resolved this issue?
I'm getting vertical misaligned rows in IE11. Chrome works fine.
Kind regards
Oscar.
0
Oscar
Top achievements
Rank 1
answered on 15 Apr 2014, 01:53 PM
Hi kendo Team:
You can watch this effect in the attached picture.
0
Nikolay Rusev
Telerik team
answered on 15 Apr 2014, 01:54 PM
Hello Oscar,

We will need a runnable example of the behavior you describe in order to assist you further.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Oscar
Top achievements
Rank 1
answered on 15 Apr 2014, 02:47 PM
Hi Nikolay:
Do you have any http://cdn.kendostatic.com for build 2014.1.409?
0
Oscar
Top achievements
Rank 1
answered on 15 Apr 2014, 04:02 PM
Hi Nikolay:
I've attached a sample that reproduces de issue.
Kind regards.
0
Nikolay Rusev
Telerik team
answered on 16 Apr 2014, 07:51 AM
Hello Oscar,

The misalignment is caused due to odd rendering bug in IE11. If you set margin of any value for the checkboxes the rows will render in sync. I'm attaching update example.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Oscar
Top achievements
Rank 1
answered on 16 Apr 2014, 12:47 PM
Thank you very much, Nickolay. It works like a charm.
Kind regards.
Oscar.
0
Ritu
Top achievements
Rank 1
answered on 27 May 2015, 07:35 AM
The issue still exists try to add new record and see the result. rows are still misaligned.
0
Bryan
Top achievements
Rank 1
answered on 06 Apr 2016, 03:52 PM

I am having the same issue using the locked column in our grid. The issue is specific to IE11.

Has this been resolved. It looks like no one responded.

0
Dimo
Telerik team
answered on 06 Apr 2016, 03:56 PM
Hi Bryan,

There are no current outstanding issues related to row height mismatch. Which Kendo UI version are you using? Do you have anything inside the Grid table cells that loads with a delay and expands the rows?

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Bryan
Top achievements
Rank 1
answered on 06 Apr 2016, 04:12 PM

Hi Dimo,

Thanks for the quick response. version is 2016.1.226. The grid is created in the document.ready.

More specifics to recreate the issue:

load the page

the first column is locked and the rest of the columns scroll

The last row locked column has text and row cutoff. All other columns show without issue.

If I resize the locked column (drag edge of header to make it larger), it resets the last row locked column to show all text and row is aligned between the locked and scrollable columns.

One other thing, this is occurring in both IE11 and Chrome latest version. I was wrong to say it was only IE11.

 

 

0
Bryan
Top achievements
Rank 1
answered on 06 Apr 2016, 07:41 PM

Hi Dimo,

I have found out further that when I remove bootstrap.css from layout file, the issue goes away. 

I wanted to let you know in case you are aware of any other bootstrap issues.

0
Dimo
Telerik team
answered on 08 Apr 2016, 02:28 PM
Hi Bryan,

Here is a test page that registers the Bootstrap CSS and appears to work as expected. Do I need to change anything for the misalignment to occur? Let me know.

http://dojo.telerik.com/Ijeku

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Sruthi
Top achievements
Rank 1
answered on 14 Mar 2017, 07:32 AM

Hello , 

 

We have downloaded the latest build of Kendo version V2017.1.118 .We are facing issues with the lining of the heights of the rows. The height of the locked rows and the unlocked rows does not match, on the load of the page. However, any event on the window such as the window resize,  the height of the rows get aligned properly. But on refreshing the kendo grid, the problem comes again and it persists, no matter whatever is done.

Regards,

Mihir

 

 

 

 

0
Kiril Nikolov
Telerik team
answered on 14 Mar 2017, 09:07 AM
Hi,

Can you please create a runnable sample where the issue can be reproduced and send it in a separate support request? We will be happy to help!

Regards,
Kiril Nikolov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Scott Waye
Top achievements
Rank 2
Veteran
Iron
answered on 22 Mar 2017, 07:26 PM
We also have the same problem (2017.1.118), in Edge.  Although we create the non fixed columns at run time to create a crosstab.
0
Stefan
Telerik team
answered on 24 Mar 2017, 11:44 AM
Hello Scott,

This is not a known issue and it was not reproduced in our testing scenario.

I made an example with locked columns using version 2017.1.118 and it is working as expected on Edge:

http://dojo.telerik.com/eZasA

If possible, please modify the provided example to reproduce the issue or send a new one, and I will gladly assist.

Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
Scott Waye
Top achievements
Rank 2
Veteran
Iron
answered on 24 Mar 2017, 01:46 PM

Hi, its a more complicated scenario and requires an async template

http://dojo.telerik.com/eZasA/2

0
Stefan
Telerik team
answered on 28 Mar 2017, 07:41 AM
Hello Scott,

This is expected because there is a difference in the height of the rows. When the Grid has frozen columns, there are two rendered table elements and if the rows are higher in one of the table, the second will not expand automatically.

In this scenario, I can suggest autofitting the column that may have a longer text to ensure that it will be fit on one row:

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-autoFitColumn

I modify the Dojo to demonstrate this:

http://dojo.telerik.com/eZasA/3

Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
Charan
Top achievements
Rank 1
answered on 04 Feb 2021, 04:28 AM

Hi Team,

When a kendo grid has both locked columns and unlocked columns, the rows are not aligning properly when I set grid auto resize property to the kendo grid. If I remove grid auto resize property and defining some height it's working good. So what can we do now to make grid align properly when we set grid auto resize property

0
Eyup
Telerik team
answered on 05 Feb 2021, 12:05 PM

Hello Charan,

 

This thread starts to get quite large and it is difficult to track what exactly is going on and whether the locked columns + resizing issue you mentioned is related to the problem discussed here. 

In order to provide you with more efficient and to-point answer tailored for this specific case, could you open a new formal thread and send us a sample screenshot demonstrating what exactly is happening? Then, we will be able to better figure out the appearance issue and provide more accurate and precise suggestions to resolve it.

 

Regards,
Eyup
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Bill
Top achievements
Rank 1
Answers by
Nikolay Rusev
Telerik team
Bill
Top achievements
Rank 1
Kiril Nikolov
Telerik team
Oscar
Top achievements
Rank 1
Ritu
Top achievements
Rank 1
Bryan
Top achievements
Rank 1
Dimo
Telerik team
Sruthi
Top achievements
Rank 1
Scott Waye
Top achievements
Rank 2
Veteran
Iron
Stefan
Telerik team
Charan
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or