CODEWITHSUNDEEP
javascriptkendo-uitelerikkendo-gridkendo-asp.net-mvc
loxdog
loxdog

Reputation: 1007

Kendo UI Grid Row Height set Dynamically by control

Previously when using the Kendo UI Grid control (version 2014.1.318), the height of any rows in my grid were fixed and ellipses were used to show any content outside the width of the cell - looking a little like the below:

How it's supposed to look

Now, since I upgraded to the latest version of the controls (2014.2.903), the height of the row seems to be adjusted to fit the content:

Not the appearance I want

The HTML for that row now contains the in-line style of the below, whereas previously it did not. 

style="height: 45px;"

I'm guessing this is the problem. I want to know if there's a way to turn off this feature or where in the scripts I can remove this. I can't even find when this was introduced in the release history!

EDIT: I've identified the problem lies within the kendo.common.min.css file. If I use the old one, everything works fine... just got to find the new style that's causing the issue

Upvotes: 2

Views: 8774

Answers (2)

Cody Leroy Lindley
Cody Leroy Lindley

Reputation: 76

You might consider providing your own CSS to adjust the Grid. I've provided an example here. The main CSS that would interest you being:

.k-grid table {
   table-layout: fixed;
}

.k-grid tbody tr{
    height: 50px;
}

.k-grid td{
    white-space: nowrap;
    text-overflow: ellipsis;
}

You can read more about this on the Telerik forums

Upvotes: 6

loxdog
loxdog

Reputation: 1007

Following up from Cody's CSS, the problem was found in the kendo.common.css file. I used the entire new set of files from 2014.2.903, but with that one file set to the 2014.1.318 version. Not sure what's changed in those files, as I ran a comparison and couldn't spot the offending line.

Upvotes: 0

Related Questions