Вложенные всплывающие окна с позиционированием привязки ⇐ Html

[Anonymous]

Я пытаюсь создать вложенное всплывающее окно, использующее только CSS, с помощью API popover.
Чтобы упростить задачу, я добавил кнопку, которая открывает всплывающее окно, а внутри этого всплывающего окна — несколько кнопок, которые открывают второе всплывающее окно над кнопкой.
Я пытаюсь привязать второе всплывающее окно к кнопке внутри первого всплывающего окна, но это не работает, и второе всплывающее окно всегда смещается (я предполагаю, потому что первое всплывающее окно не видно при загрузке, а браузер не может определить положение привязки)

Код: Выделить всё

#first-popover {
width: 300px;
}
#first-popover button {
anchor-name: --my-anchor;
width: fit-content;
}
#second-popover {
position-anchor: --my-anchor;

}

Код: Выделить всё

Open first popover

Open second popover

Hello world

Есть предложения, как это исправить?

Подробнее здесь: https://stackoverflow.com/questions/797 ... ositioning