Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Problem/Motivation
We are not exact and consistent when applying vertical spacing for form elements in CSS rules.
Comment | File | Size | Author |
---|---|---|---|
#7 | improve-form-vertical-grid-layout-3130069-7.patch | 2.31 KB | pivica |
#7 | improve-form-vertical-grid-layout-3130069-6-7-interdiff.txt | 1.18 KB | pivica |
Comments
Comment #2
pivica CreditAttribution: pivica at MD Systems GmbH commentedHere is a patch.
Comment #3
sasanikolic CreditAttribution: sasanikolic at MD Systems GmbH commentedThis caused some mobile margin issues between elements inside a flexbox. We should probably use a sibling selector for the form groups there.
Comment #4
sasanikolic CreditAttribution: sasanikolic at MD Systems GmbH commentedHere is a patch with the proposed improvement.
Comment #5
pivica CreditAttribution: pivica at MD Systems GmbH commentedLooks good, can we please add some commentary explaining exactly why we added sibling selector there? I think the issue is not exactly for mobile here but the issue is that that selector is expecting sibling .form-group elements and webform flex is wrapping .form-group in flexbox wrappers which are messing this selector goal to only reset last .form-group margin-bottom. And then because this margin reset is applied for all form-group elements then you get the issue for mobile also.
Comment #6
sasanikolic CreditAttribution: sasanikolic at MD Systems GmbH commentedThis patch adds the comment as suggested.
Comment #7
pivica CreditAttribution: pivica at MD Systems GmbH commentedImproved comments a bit more.
Comment #9
pivica CreditAttribution: pivica at MD Systems GmbH commentedCommitted.