ca2c607f90
Summary: The only thing I found in the spec for this change is the following. Not exactly sure if this is the thing this PR is about: > For each flex item, subtract its outer flex base size from its max-content contribution size. If that result is not zero, divide it by (if the result was positive) its **flex grow factor floored at 1** or (if the result was negative) by its scaled flex shrink factor, having **floored the flex shrink factor at 1**. This is the item’s max-content flex fraction. But at least it seems a required change. Fixes facebook/yoga#566 Closes https://github.com/facebook/yoga/pull/572 Differential Revision: D5264388 Pulled By: emilsjolander fbshipit-source-id: 0004d1c3b9bad070a98cd6766c1adc06a54475f8
44 lines
1.6 KiB
HTML
44 lines
1.6 KiB
HTML
<div id="flex_basis_flex_grow_column" style="width: 100px; height: 100px;">
|
|
<div style="flex-basis: 50px; flex-grow: 1;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_flex_grow_row" style="width: 100px; height: 100px; flex-direction: row;">
|
|
<div style="flex-basis: 50px; flex-grow: 1;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_flex_shrink_column" style="width: 100px; height: 100px;">
|
|
<div style="flex-basis: 100px; flex-shrink: 1;"></div>
|
|
<div style="flex-basis: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_flex_shrink_row" style="width: 100px; height: 100px; flex-direction: row;">
|
|
<div style="flex-basis: 100px; flex-shrink: 1;"></div>
|
|
<div style="flex-basis: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_shrink_to_zero" style="height: 75px;">
|
|
<div style="width: 50px; height: 50px; flex-shrink:0;"></div>
|
|
<div style="width: 50px; height: 50px; flex-shrink:1;"></div>
|
|
<div style="width: 50px; height: 50px; flex-shrink:0;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_overrides_main_size" style="height: 100px; width: 100px;">
|
|
<div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
|
|
<div style="height: 10px; flex-grow:1;"></div>
|
|
<div style="height: 10px; flex-grow:1;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_shrink_at_most" style="height: 100px; width: 100px;">
|
|
<div>
|
|
<div style="flex-grow:1; flex-shrink:1;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_less_than_factor_one" style="height: 500px; width: 200px; flex-direction:column;">
|
|
<div style="flex-grow:0.2; flex-shrink:0; flex-basis: 40px;"></div>
|
|
<div style="flex-grow:0.2; flex-shrink:0;"></div>
|
|
<div style="flex-grow:0.4; flex-shrink:0;"></div>
|
|
</div>
|