在这种情况下如何处理绝对，溢出和zindex

Question

我在多个图层中都有一个下拉组件。下拉组件的结构如下：

<div id="label-container">
   <div id="root">
      <div id="btn" />
      <div id="menu" />
   </div>
</div>

菜单是绝对位置，并且具有较高的z索引。根是相对于位置的，因此菜单宽度与下拉菜单的宽度一致。

整体结构看起来像：

<label> js上面显示的组件。 split-row每行包含两个下拉菜单。上面的父母是标准的flex div。

我的问题是菜单扩展了父祖先（几对父级）。我已经尝试过overflow:visible/hidden和position:relative在各种元素上的每种组合，但都没有成功。

我无法使菜单固定，并且根目录必须相对于约束菜单的宽度。

如何创建父级overflow: hidden，但确保菜单仍然可见？

我看过诸如this和this之类的问题，但似乎没有任何有效的方法。

Answer 1

你能告诉我如何解决吗？因为我也面临着同样的问题。我在定位和溢出方面尝试了很多概率，但没有任何结果。