-
Notifications
You must be signed in to change notification settings - Fork 78
Description
I noticed that in 06964fe the Fieldset component was migrated to use display: grid in one of the containers.
After this change some of my Fieldsets started to show inner content that is wider than the fieldset itself. I.e. the content overflows the Fieldset container despite the fact that it is enough space to just wrap long lines of text. This is happenning when the parent of Fieldset component has pretty narrow width (e.g. 256px).
Previously (when all containers of Fieldset were display: block) it worked fine, the content was fit inside the fieldset (long lines were just wrapped, as expected). But with grid this doesn't work anymore.
I found a similar problem with grid: https://stackoverflow.com/questions/43311943/prevent-content-from-expanding-grid-items
The proposed solution is to use min-width: 0 to the grid cell. It says that it is needed only for Firefox, but I actually have this behavior in Chrome.
Anyway, this solution works for me (at least in Chrome):
.p-fieldset-content-wrapper {
min-width: 0;
}I'm not sure if it is 100% bullet-proof solution and if there are any other side-effects. I use fieldsets a lot and didn't find any problems so far after adding min-width: 0 to the p-fieldset-content-wrapper class.