-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Safari (formio.js >= 4.16.x): Columns component inside a Data Grid, the Columns are too narrow (unusable) #5426
Comments
Workaround for Safari 16.6 (AFAIK), with Columns in a Data Grid. The Columns become too narrow and unusable in a Data Grid. GitHub issue: formio/formio.js#5426 This workaround adds 1 CSS rule, which adds a `width: 100%` to the first `<td/>` (column) targeted in a Data Grid table. width: 100%; }
Hey @bobslee thanks for reporting this. I'm unable to reproduce this on the form.io sandbox; that being said, I'll make sure this gets in front of the folks that prioritize these tickets, if I had to guess it's likely a CSS issue in the @formio/bootstrap repo. |
@brendanbond Thanks for answering and follow up. Concerning 1st screenshot (a form):
Concerning 2nd screenshot (form builder component): Thanks! |
Workaround for Safari 16.6 (AFAIK), with Columns in a Data Grid. The Columns become too narrow and unusable in a Data Grid. GitHub issue: formio/formio.js#5426 This workaround adds 1 CSS rule, which adds a `width: 100%` to the first `<td/>` (column) targeted in a Data Grid table. width: 100%; }
I'm gonna go ahead and close this as it looks all be resolved in the 5.x version of formio.js. We've also added a "Hide Preview" button in the editor to improve the UX when editing components that have columns. |
Observed behavior
Browser
Affected formio.js versions
Issue
See the screenshots below.
A Columns component inside a Data Grid: The Columns are too narrow (unusable).
I also tested with Bootstrap versions: 4.1.3, 4.4.1, 4.6.2
No differences with the formio.js versions above; has the same outcome.
Screenshots
Form: Data Grid with Columns inside
Form Builder: Columns component
Some "Column Properties" are too narrow.
The text was updated successfully, but these errors were encountered: