Kendo Grid与Bootstrap下拉列表或工具提示不兼容 [英] Kendo Grid do not play nice with Bootstrap dropdown or tooltips

问题描述

我正在尝试在Kendo Grid中使用某些Bootstrap元素，例如Bootstrap下拉按钮和工具提示。

I'm trying to use certain Bootstrap elements inside a Kendo Grid, for example Bootstrap dropdown buttons and tooltips.

问题是下拉列表或工具提示始终定位在下方或上方的行下方。我已经尝试调整显示元素的z-index，但这并没有解决它。

The problem is the dropdown or tooltips are always positioned below the row below or above. I've tried adjusting the z-index of the displayed elements, but this doesn't fix it.

有没有人设法找到解决方案？

Has anyone managed to find a solution to this?

推荐答案

.btn-group类，它是下拉菜单的容器，位置相对如此改变了下拉列表的z-index -menu类不会有任何好处。您可以绝对定位，然后从那里调整定位。这样的事情可以让你开始：

The .btn-group class, which is the container for the dropdown-menu is positioned relatively so altering the z-index of the dropdown-menu class won't do any good. You can position is absolutely and then adjust the positioning from there. Something like this should get you started:

.k-grid-content .btn-group {
    position: absolute;
}

.k-grid-content .btn-group .btn {  
    top: -10px;
}

链接到jsFiddle，演示它的实际效果。

Link to a jsFiddle that demonstrates it in action.

这篇关于Kendo Grid与Bootstrap下拉列表或工具提示不兼容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！