I am having trouble laying out components (using flex) within a Dialog with buttons. If I change the outer flex div from 80% to 100% it uses too much space. If I remove the 100% on the EjsGrid div, it also does not work.
If anyone can tell me what I am doing wrong, that would be great, Thanks!
ISIndrajith Srinivasan Syncfusion Team January 9, 2020 08:56 AM
Hi John ,
Greetings from Syncfusion support
We have validated your query “it uses too much space” with shared code snippet. By Default, Blazor dialog adjusts its width and height based on specified target. If target is not specified, it picks the ‘document.body’ as target. So, the dialog renders by occupying document.body’s width and the flex-box elements doesn’t cause dialog’s width.
In order to resolve it, we can follow the below ways.
Specify the target to the dialog that the dialog displays over on it.
Could you please try out the above solution and confirm whether it meets your requirement? Else please revert us with your requirement details.
JOJohnJanuary 12, 2020 10:59 AM
Dear Indrajith. Thank you for the reply. I ended getting it working, so that Grid(s) will scroll both horizontally and vertically using the following style, as demonstrated in the image. If this is not the best way, please let me know. Many thanks, John
ISIndrajith Srinivasan Syncfusion Team January 13, 2020 03:15 AM
Yes, you can achieve your requirement using your solution. Or you can also refer our UG documentation on adjusting the Grid height and width based on the its parent containers height and width.