Issue: There is massive white or grey space when I use an embedded canvas app in model-driven Power Apps. I have fixed the height of the canvas app to 150px but the model driven app adds more than 1000px as height for the embedded canvas app, i have tired responsive as well as fixed both didnt work. I checked the backend code, it is contained in iframe which is fixing the minimum height of the embedded canvas app container to certain height. I want to resize the height. i have tired javascript and css but model driven app is overriding the changes which i made.
Analysis:
Microsoft recommends validating the following settings based on how the canvas app is designed:
If the canvas app is responsive
- Review the app’s display settings and test the behavior with Scale to fit enabled or disabled, as embedded canvas apps may render differently compared to standalone canvas apps.
- Avoid dynamically setting screen height based on parent or container values, as this can result in additional whitespace or scroll bars when embedded.
If the canvas app is non‑responsive (fixed size)
Enable Scale to fit so the app can scale proportionally within the available space on the model‑driven form.
- Ensure the App Name property is correctly set in the embedded canvas app control on the model‑driven form.
- Use a simple form layout (for example, a single‑column section) for the embedded canvas app to avoid layout recalculations that may increase the rendered height.
I have tired both responsive and fixed, but for both it keeps adding massive white space, which I have to scroll more than one screen of white space to get to the next section. I have set the height to 150px only. But still nothing worked. I forced all the control to specific height, but still model driven app is adding more white space. I have tried to create a classic view or a modern view. Outside of the classic view and connected directly to MDA, I gave the proper name and app ID. But nothing seems to be working.