Kendo grid resize shrinks all the columns in IE

Question

I'm using Kendo grid in my application. When I try to resize a column in IE, all the other columns in the table disappear.

This does not happen in Firefox or Chrome, just IE 9 and 10.

Can someone please help on this as I'm breaking my head over this issue from a day?

Answer 1

The issue is with mixing percentages and px for your column width.

One solution is to make sure you assign a specific width to EVERY column in your grid (120px).

Do NOT use percentages, unless your parent has a specific width (not 100%, but 800px or something like that).

Answer 2

There is a good chance this is to do with IE not inheriting CSS properties the same way as the other browsers. The Kendo widget will be output in its own div (check the kendo CSS, might be something like k-container or k-widget), so look at its CSS and that of any parent divs and you might have some luck.