有没有办法（公式）来计算flex-grow，flex-shrink和flex基础上描述的flex元素的绝对大小？

Question

我制作了一个小型演示 http://html5.by/blogdemo/flexbox/flex-grow-shrink-basis-stackoverflow.html

Flex容器中有2个弹性项目

1. flex：1 2 1000px;
2. flex：1 1 100px;

弹性容器的绝对宽度 - 500px;

最后，你可以看到，flex元素的宽度是：

1. 421px
2. 79px

我的问题：有没有办法用数学方法描述计算出的尺寸（公式）？

Answer 1

与公式最接近的是规范中的算法：

http://www.w3.org/TR/css3-flexbox/#resolve-flexible-lengths

我不认为它可以很容易地在公式中描述。您可以使用公式覆盖简单情况，但当元素具有min-width或max-width约束时，它会变得更复杂（并且需要算法的多个循环）。

SIDE注意：flexbox规范可能会很快对flex-grow和flex-shrink行为进行少量更改，因此当它们的总和小于1时，它们会更像是一个百分比。 （因此，即使您是唯一的孩子，flex-grow: 0.1永远不会给您超过10％的可用空间。）此提议在此处描述：http://lists.w3.org/Archives/Public/www-style/2013Oct/0246.html