vanilla-framework icon indicating copy to clipboard operation
vanilla-framework copied to clipboard

sections do not expand to cover margin-bottom on children

Open lyubomir-popov opened this issue 1 year ago • 2 comments

On sections (and probably other elements?) margin-bottom of children is clipped. The old trick of overflow-y:auto fixes it:

To replicate, place a paragraph in a section and compare:

without the fix: image

with the fix: image

lyubomir-popov avatar Oct 21 '24 11:10 lyubomir-popov

Thank you for reporting us your feedback!

The internal ticket has been created: https://warthogs.atlassian.net/browse/WD-16066.

This message was autogenerated

I'm not sure if we should apply such changes to base HTML elements.

Margin bottom is not clipped. Yes, by the browser terms it overflows from the section itself, but is applied. section is a purely block element without any explicit styles, doesn't have any margin itself, so applying overflow: auto doesn't seem to have any visual effect on margin collapse.

If we do that for section should we do it for div as well? what others?

If there are specific places where baseline drifts they are likely not caused by browser native styling of elements, but errors in our components. So we should track those instead I believe.

bartaz avatar Oct 21 '24 11:10 bartaz