Fullscreen dialog?

Open supersyntx opened this issue 2 years ago • 6 comments

Can I make the dialog fullscreen?

Aug 31 '23 05:08 supersyntx

Yes. Try h-screen and w-screen in Dialog.Content.

Aug 31 '23 19:08 Josevictor2

only h-screen works, for width you must use max-w-screen. Even then the content seems to be centered for some reason

Oct 26 '23 08:10 Sayyiditow

Try min-w-full and h-screen

Nov 21 '23 10:11 DashkovMykyta

<DialogContent className="max-w-screen h-screen "></DialogContent>

Jun 05 '24 12:06 Henryle-hd

You'll want to add overflow-auto to these, else if the content goes below the fold it won't be visible nor scrollable.

Jun 09 '24 20:06 wallawe

Was running in to this issue the other day, and i can recommend using the max-h-[calc(100dvh)] on the DialogContent to ensure the dialog doesn't run over the bottom and top in Chrome/Safari.

Also adding the overflow class of choice to ensure scrollability.

Jun 11 '24 06:06 jeandcr

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.

Jul 03 '24 23:07 shadcn