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