将“过滤器”弹出窗口置于网格顶部的前面

Question

我正在使用AG Grid社区与Material进行角度处理，并且列过滤器弹出面板面临以下问题：

当过滤的行多于4或5行时，这一切都很好，因为面板正确显示而没有中断。但是，当过滤的行数少于2甚至3时，面板将被截断。我已经检查了元素并尝试为其找到选择器，但似乎无法正确设置z-index。我也很想弄乱溢出属性，因为文档建议不要这样做。我尝试在自己的styles.css（全局）中覆盖的选择器是ag-filter和ag-menu以及ag-filter-body-wrapper-全部无效。

我已经阅读了文档，对此也没有任何配置。是否有一些sass变量或我应该替代的东西？

谢谢。

Answer 1

该行为是因为过滤器显示在容器内。尝试将过滤器的CSS位置设置为固定。这应该允许过滤器显示在容器上方。

有关更多信息，请参见this plunkr

有一个外部 div，例如您的表包装，还有一个又名过滤器的框：

CSS：

.box {
  width: 100px;
  height: 100px;
  background: red;
  color: white;
}

#one {
  position: fixed;
  top: 255px;
  left: 10px;
  background: blue;
}

.outer {
  width: 500px;
  height: 300px;
  overflow: scroll;
  padding-left: 150px;
}

HTML：

<div class="outer">
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam congue tortor eget pulvinar lobortis.
   
  </p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam congue tortor eget pulvinar lobortis.
    Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam ac dolor augue.
    
  </p>
  <div class="box" id="one">One</div>
</div>

如您所见，div显示在容器上方。