Description

Most of the time when using the modal component, the modal itself assumes the height of the content.

This isn't the case when the 'fill' size is used (and possibly when isFullScreen is true), in this situation the modal takes up the majority of the page's height.

With the 'fill' size the div that wraps any children still collapses to its content height, so a user of the component can't add children that are set to height: 100%. (at least I wasn't smart enough to find a way to do it, without overriding the modal styles). It's this div that doesn't have a classname that causes the issue:

When fill size is active, it might better for the div in question to have a style like min-height: 100%. This way it's easier for children to be set to 100%, but also they can overflow the content div and become scrollable if needed.

Step-by-step reproduction instructions

1. Open the story for modal - https://wordpress.github.io/gutenberg/?path=/story/components-modal--default&args=size:fill
2. Using the storybook controls, set the modal height to 'fill'
3. Now try setting some of the content in the modal to 100% size, maybe so that the button appears at the bottom of the modal, and observe it's pretty challenging to do.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure