Wie zeige ich einen Dialog in React direkt über dem Div an, das ihn geöffnet hat? ⇐ HTML

[Guest]

Ich entwickle ein Browserspiel in React. Ich habe ein Zellenraster und möchte, dass beim Klicken auf eine Zelle direkt darüber ein Dialogfeld mit einigen Optionen geöffnet wird.
Hier ist eine grobe Darstellung, wie sie positioniert werden sollte beim Klicken auf diese Zelle, Zeile 5, Spalte 4:



Ich kann jede Technik oder Bibliothek für den Dialog verwenden.
Ich habe versucht, den Dialog in Headless UI zu verwenden – https://headlessui.com/react/dialog
Ich kann ihn nur zentrieren oder mit „Fixed“ positionieren Elemente wie:

Code: Select all

Das Problem dabei ist, dass ich sie für jede Zelle berechnen müsste, und da das Layout reagieren sollte, würde es kompliziert werden, für verschiedene Bildschirmgrößen zu berechnen.
Idealerweise hätte ich einen Dialog, der sich relativ zur Zelle (Div) öffnet, auf die geklickt wurde. CSS, entweder mit einer React -Komponentenbibliothek?