Completed
Last Updated: 29 May 2020 07:55 by ADMIN
Karl Mikesell
Created on: 30 Jan 2020 12:27
Category: Grid
Type: Bug Report
0
Grid's layout breaks when "scrollable: false" and columns' width exceed 960px

Bug report

Grid's layout breaks when having columns with defined widths which sum exceeds 960px and the scrollable property is set to false.

Regression introduced in 2020.1.114

Reproduction of the problem

Open this Dojo in fullscreen and see Grid's layout.

If you change the Kendo UI version to 2019.3.1023, Grid's toolbar is correct

Current behavior

Grid's layout is breaking
image

Expected/desired behavior

Grid's layout shouldn't break.
image

Environment

  • Kendo UI version: 2020.1.114
  • jQuery version: x.y
  • Browser: [all]
3 comments
ADMIN
Petar
Posted on: 29 Apr 2020 11:12

Hello Karl,

I am writing this reply to share with the community the workaround for the current issue. А possible solution for the described scenario is to use the following CSS definition. 

.k-grid {width: auto !important; min-width: 960px; display: table;}

The above can be applied globally for the project or on the pages that have the Grid component.

Here is a Dojo project that demonstrates the usage of the above snippet. The example has two Grids in it. The first one has only one column and a size of 960 pixels. The second one has also a set width of 960 pixels but expands based on the widths set for each column. 

Regards,
Petar
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
ADMIN
Petar
Posted on: 23 Apr 2020 17:14

Hello Karl,

After deeper research about this issue, it seems that it is not a bug. The way the columns overflow the Gird's border is expected behavior as it is mentioned in the documentation - https://docs.telerik.com/kendo-ui/controls/data-management/grid/appearance/width

If the Grid component has worked differently in the previous Kendo UI versions, this behavior wasn't expected one. With version 2020.1.114 the Grid works as it is expected to work(and described in the above link). I am sorry for the inconvenience that you experience after the release of Kendo UI 2020.1.114.

If you have any questions related to the Grid's configuration, please submit a support ticket and we will be happy to help you. 

Regards,
Petar
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Karl Mikesell
Posted on: 16 Apr 2020 18:56
Removing the width configuration results in a grid that becomes the same width as browser; resulting in a equally ugly wide grid.  The configuration should still support exceeding columns, but limit appearance to the specified width (unless field data requires more).  This regression only effects the column header row, not the grid rows.