I’ve got a Material UI dialog that contains nothing but some text and an Icon with a Menu options dropdown. The demo can be seen here: https://codesandbox.io/s/prod-rain-1rwhf?file=/src/App.js
I’m trying to position the Menu component so that it appears just below the Settings component. I’ve specified a position: relative on the parent element (i.e. the Settings Icon) as well as a position: absolute with top: -10px to the child element (i.e the Menu component), but that doesn’t seem to work.
How can I set it up so that when the Settings icon is clicked, the Menu appears directly below the Settings, as well as when the window is resized so that the Menu follows?