Re: [csswg-drafts] [css-box] Explicit control over margin collapsing

> Margin collapsing already seems one of the weirdest CSS features for beginners, and edge cases like 'collapsing-through' zero-height blocks, overlapping of collapsed margin and the clearance created after the cleared float etc. can confuse even more experienced authors.

Yes, which speaks _for_ the introduction of a property to control — i.e. disable — margin collapsing, but see below.

> Also, introducing margin collapsing to 2D layout contexts like Grid …

Grid and Flexbox explicitly define that their containers and items do not allow margin collapsing.

Note the [comment about margin collapsing related to the grid container]( in the Grid specification:

> floats do not intrude into the grid container, and the grid container’s margins do not collapse with the margins of its contents.

And [for grid items](

> As adjacent grid items are independently contained within the containing block formed by their grid areas, the margins of adjacent grid items do not collapse.

The Flexbox specification has similar notes for [flex containers]( and [flex items](

> I generally don't like the idea of introducing margin collapsing concept into contexts other than block layout and prefer the idea of the *-gap property for everything (maybe even for paragraphs, instead of collapsed margins, in order to distribute paragraphs regularly, while margins can still be used to tweak this distribution).

I agree that margin collapsing should be restricted to block layout and that Flexbox should rather get a `flex-gap` property controlling the distances between the flex items, which would serve the given use case and also align it more with the Grid specification.


GitHub Notification of comment by SebastianZ
Please view or discuss this issue at using your GitHub account

Received on Thursday, 11 May 2017 11:43:13 UTC