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之类的问题，但似乎没有任何有效的方法。