- From: celestepan via GitHub <noreply@w3.org>
- Date: Fri, 27 Feb 2026 21:09:25 +0000
- To: public-css-archive@w3.org
celestepan has just created a new issue for https://github.com/w3c/csswg-drafts: == [css-grid-3][masonry] Negative margins should affect gaps between items == I'd like to propose a change to the spec where negative margins "eat" into the grid-gap placed between items. The spec states that negative margins should affect the contribution of an item to the running position down to 0px (https://www.w3.org/TR/css-grid-3/#grid-lanes-layout-algorithm), but specifies that the stacking axis gap should be added to the running position of a track after an item is placed. The running position contribution of an item in the spec right now is: `max_pos + clampToZero([outer size](https://www.w3.org/TR/css-sizing-3/#outer-size)) + [grid-gap](https://www.w3.org/TR/css-align-3/#propdef-grid-gap).` I think the formula should be changed to: `max_pos + clampToZero(outer_size + grid-gap)` If an item 1 has `height: 30px`, `margin-top: -40px` and the gap is `10px`, following the _spec_ formula, we'd get: <img width="516" height="411" alt="Image" src="https://github.com/user-attachments/assets/7e86c607-6a0e-472b-b046-a26eda57a627" /> Whereas if we _don't always add the stacking axis gap afterwards_, we would end up with: <img width="493" height="427" alt="Image" src="https://github.com/user-attachments/assets/7cc7d269-4b4c-402b-a828-6bd45c2d2943" /> which doesn't have that awkward gap at the top of track 1. If we were to follow the spec, a user could also continuously place items with a negative margin greater than its size, and the grid-gap would just continuously add to the running position of that track. Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13574 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Friday, 27 February 2026 21:09:26 UTC