У меня есть выпадающий компонент внутри нескольких слоев. Компонент раскрывающегося списка имеет следующую структуру:
<div id="label-container">
<div id="root">
<div id="btn" />
<div id="menu" />
</div>
</div>
Меню является абсолютным положением и имеет высокий z-индекс. Корень является относительным положением, поэтому ширина меню соответствует ширине раскрывающегося списка.
Общая структура выглядит примерно так:
<label> js компонент, показанный выше. split-row - это каждая строка, содержащая два раскрывающихся списка. Родители выше, это стандартные flex-дивы.
Моя проблема в том, что меню расширяет родительского предка (на пару уровней вверх). Я пробовал каждую комбинацию overflow:visible/hidden и position:relative на разных элементах, но безуспешно.
Я не могу сделать меню фиксированным, и root должен быть относительно ограничения ширины меню.
Как сделать родителя overflow: hidden, но убедиться, что меню все еще видно?
Я смотрел на такие вопросы, как это и это , но, похоже, ничего не работает.
