Javascript 如果没有空间，则隐藏Flexbox响应元素

我有一个要求，使flexbox显示项目，它可以容纳和其余的元素不应该是可见的。 在这里，每个项目都有一个覆盖div，它将显示在hover上

我试着将这个弹性盒包装起来，并将高度固定并设置为overflow-y:hidden。我能够根据屏幕大小动态删除/显示项目。 但由于我将高度设置为固定，因此当我将鼠标悬停在任何项目上时，它都不会显示相应的覆盖元素

CSS的PFB

enter code here
.facets-container {
    display: flex;
    flex-wrap: wrap;
    height: 38px;
    overflow-x: hidden;
    overflow-y: hidden;
  }