hi,
This issue happens because a Scroll Container inside a modal popup needs a fixed or calculable height.
In a modal layout, if the Scroll Container (or any parent container) has height = auto with no limit, the content will not render visibly. When you place the same widgets outside the Scroll Container, they appear because they are no longer constrained by the modal layout.
Correct fix (works 100%):
vh)Example CSS:
.modal-scroll {
max-height: 80vh;
overflow-y: auto;
}
Apply this class to the Scroll Container or its parent.
Set a fixed height for the modal
The most common and easiest fix is to give the modal a defined height so the Scroll Container has space to render its content. Open the Page Properties of the modal page, go to the Layout tab, and check the height setting. If it is set to Auto, try changing it to a fixed value such as 500px. This gives the Scroll Container a clear boundary to work within.
Use a Container or Layout Grid instead of a Scroll Container
If you don’t specifically need the Top / Bottom / Left / Right regions that a Scroll Container provides, you may not need it at all. In many modal use cases, a simple Container or Layout Grid works better. You can make it scrollable by adding custom styling in the Appearance -> Style field, for example:
max-height: 400px; overflow-y: auto;
This approach is often simpler and more predictable inside popups.
Check the Scroll Container settings
If you do need to use a Scroll Container, make sure its configuration is correct. In the Center region, verify that the Scroll behavior is set to Per region rather than Full page. Using “Full page” inside a modal can prevent the content from becoming visible because the popup itself does not control the full page height.