[css-flexbox] Percentage Margins and Paddings

Howdy,

I've been following the issue regarding percentage margins and paddings on
flex items closely. I'd like to propose a new property to address the issue.

This may be bad timing considering the last call, but I think it might be a
good idea to approach the problem from an implementation perspective. I
wrote about the issue in detail on my blog (
http://www.radiumvinteractive.com/flexbox-percentage-margins-and-paddings/)
as a sort of overview of the situation.

I think a new property could solve the problem, but it might be too narrow
of a use-case. I'd love to get some feedback.

Here's my idea for the `flex-relation` property:

---

flex-relation: main-axis | cross-axis | width | height | auto

The flex-relation property allows for changing the dimension that
percentage margins and paddings are resolved against for flex items. The
property applies to the flex container and affects all immediate flex items.

main-axis:
Flex items will always resolve their padding or margin size against the
main dimension. For `row` and `row-reverse` flex containers, flex items
resolve all percentage margins and paddings against the width of the flex
container. For `column` and `column-reverse` flex containers, flex items
resolve all percentage margins and paddings against the height of the flex
container.

cross-axis:
Flex items will always resolve their padding or margin size against the
cross dimension. For `row` and `row-reverse` flex containers, flex items
resolve all percentage margins and paddings against the height of the flex
container. For `column` and `column-reverse` flex containers, flex items
resolve all percentage margins and paddings against the width of the flex
container.

width:
Flex items will resolve all percentage margins and paddings against the
width of the flex container, regardless of the flex container’s direction.

height:
Flex items will resolve percentage margins and paddings against the height
of the flex container, regardless of the flex container’s direction.

auto (default):
Flex items will resolve percentage margins and paddings against their
respective dimensions.

---

I'm not an editor or an expert, so I'm probably missing something important
here. Although it may seem like a narrow property now, it might find
usefulness with other issues that aren't apparent at the moment.

At the very least, it's an idea. What do you think?