Modal with long selectable data-table in modal body : selecting a row causes modal to content overflow

[galilmori]

What package(s) are you using?

• @console/pal v1.337.5

Detailed description

Creating a modal with a table inside with selectable rows .
if you have a lot of selectable rows selecting the last row will cause the content to overflow outside of the modal.
causing a blank modal content

Steps to reproduce the issue

• create a modal with long table content with selectable rows
• scroll to the last element
• select last element
• content disappears

sandbnox replication of the issue : https://codesandbox.io/s/dark-bush-dedz7?file=/index.js

Additional information

Suggestions for fixing this

• it appears that this can be fixed by adding position: relative to bx--modal-content currently its inheriting a static position in css

[wkeese]

This fix causes regressions: dropdowns are clipped by the edge of the bx--modal-content node. Additionally, I think the real issue here is what I listed in #9403. Since #9403 is fixed this change should presumably be rolled back.