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

Question

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

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

http://plnkr.co/edit/Eb3BL0l01GHXLvVSGTA5

Answer 1

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

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

演示

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

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

演示