Css KendoUI网格列自动调整大小

我正在尝试创建一个网格，它必须具有自动调整列大小的功能（在某些约束条件下），并且其宽度不得超过父div的宽度

我有4个专栏：

       col1        col2    col3    col4
------------------------------------------
| very long text |  ...  |  ...  |  ...  |
|     ...        |  ...  |  ...  |  ...  |
------------------------------------------

第一列中的值很长，所以我使用样式：

空白：nowrap；文本溢出：省略号文本保持在一行中。我希望
col2
是105-170px，
col3
40-190px和
col4
75-150px。我喜欢尽可能地保持它的小，以避免出现巨大的空白

我知道这样的事情可以通过设置scrollable:true来实现，但我不需要scrollbar，我真的不喜欢它在那里没有什么用处。
在玩了不同的选项和数小时的搜索后，我决定使用一个不那么优雅的解决方案，但我已经实现了我所寻找的。如果有人面临类似的问题，我会这样做：


当DOM加载（
$（document）.ready（…）
或jQuery中的
$（…）
时，我调用代码来移除
.k-grid-header的
右
填充权
，移除
.k-grid-content的
溢出-y


我使用的代码是：

// jQuery code
$(".k-grid-header").css("padding-right","0");
$(".k-grid-content").css("overflow-y","initial");

// JS (without jQuery) equivalent
var gridHeaders = document.querySelectorAll(".k-grid-header");
for (var i = 0, element; element = gridHeaders[i++];)
    element.paddingRight = "0";

var gridContent = document.querySelectorAll(".k-grid-content");
for (var i = 0, element; element = gridContent [i++];)
    element.overflowY = "initial";