4

我正在尝试创建一个必须具有自动调整列大小的网格(在某些约束内),并且它的宽度不能超过父 div 的宽度。

我有 4 列:

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

第一列中的值很长,所以我使用样式:white-space: nowrap; text-overflow: ellipsis;文本保持在一行中。我想要col2105-170px、col340-190px 和col475-150px。我喜欢让它尽可能小,以避免出现巨大的空白。

我知道这样的事情可以通过设置来实现scrollable: true,但我不需要滚动条,我真的不喜欢它坐在那里没有用处。

4

1 回答 1

3

在玩了不同的选项和数小时的搜索之后,我决定使用一个不太优雅的解决方案,但我已经实现了我想要的。如果有人面临类似的问题,这就是我所做的:

  • 当 DOM 加载($(document).ready(...)$(...)在 jQuery 中)时,我调用代码来删除 right padding-rightof.k-grid-header和 remove overflow-yof .k-grid-content

我使用的代码:

// 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";
于 2013-08-29T11:08:18.710 回答