- From: Tony Chang <tony@chromium.org>
- Date: Tue, 27 Nov 2012 13:24:59 -0800
- To: "www-style@w3.org" <www-style@w3.org>
Received on Tuesday, 27 November 2012 21:25:26 UTC
What should happen if a flex item has a negative margin?
Here's an example:
<div style="display:flex; width: 100px">
<div id="a" style="flex: 1"></div>
<div id="b" style="width: 10px"></div>
</div>
If we give #b a left margin of -50px, what should happen? In ToT WebKit
and Gecko, this causes the available space to go from 90px to 140px and #a
flexes to fill this. #a ends up being 140px wide, overflowing the flexbox.
I also get weird behavior when I set the cross axis margins to negative
values because we think there's additional space in the cross direction.
This seems very unintuitive. I think the simplest thing to do is to treat
negative margins as 0 both for calculating available space and for
positioning.
tony
Received on Tuesday, 27 November 2012 21:25:26 UTC