How to make the dialog wider? #18
-
I need to make a dialog much wider than its currently possible. How to set the width of the dialog to more than 56rem? |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment
-
The dialog style is currently assuming it is mostly used for simple content (single column).
To get a wider dialog if you e.g. intend to use multiple columns would mean removing the first factor by setting max-inline-size: calc(100vw - var(--spacing-xl)); This is a good indication, that we might want to reconsider the current style and add |
Beta Was this translation helpful? Give feedback.
The dialog style is currently assuming it is mostly used for simple content (single column).
Therefor its width (inline-size) is limited by two factors:
--max-line-length
: which is the maximum length suggested for textual contentcalc(100vw - var(--spacing-xl))
: the viewport size minus some space left and right of the dialogTo get a wider dialog if you e.g. intend to use multiple columns would mean removing the first factor by setting
This is a good indication, that we might want to reconsider the current style and add
--max-line-length
to more direct content elements like<p>
a and<h1>
instead