html5 – 使用ng-grid的列菜单的z-index问题

当我在同一页面上放置两个ng-grid并打开第一个网格的colum菜单时,第二个网格的标题重叠,如此截图中所示：

我已经尝试将列菜单上的z-index设置为非常高的值,但它没有任何效果.我尝试了其他几种方法,但我显然遗漏了一些东西.有什么建议？ Plunker展示了这里的行为：

http://plnkr.co/edit/Eb3BL0l01GHXLvVSGTA5

解决方法

使用此CSS样式强制第一个网格面板的z-index

[ng-grid=gridOptions1] .ngTopPanel {
    z-index: 2;
}

demo

更好的方法(如评论中所建议的)是使用nth-child方法.扩展到3项：

.gridStyle:first-child .ngTopPanel {
     z-index: 3;
}
.gridStyle:nth-child(2) .ngTopPanel {
     z-index: 2;
}

demo

原文地址：https://www.jb51.cc/html5/168294.html