85b8386ba1
Summary: This test creates a repro case for Yoga to emulate UFI layout failure Reviewed By: emilsjolander Differential Revision: D4313632 fbshipit-source-id: 35be7d86b50a9ae08c81891a889a74e4b61f2d27
66 lines
2.3 KiB
HTML
66 lines
2.3 KiB
HTML
<div id="max_width" style="width: 100px; height: 100px;">
|
|
<div style="height: 10px; max-width: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="max_height" style="width: 100px; height: 100px; flex-direction: row;">
|
|
<div style="width: 10px; max-height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="min_height" style="width: 100px; height: 100px;">
|
|
<div style="flex-grow: 1; min-height: 60px;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="min_width" style="width: 100px; height: 100px; flex-direction: row">
|
|
<div style="flex-grow: 1; min-width: 60px;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="justify_content_min_max" style="max-height: 200px; min-height: 100px; width: 100px; justify-content: center;">
|
|
<div style="width: 60px; height: 60px;"></div>
|
|
</div>
|
|
|
|
<div id="align_items_min_max" style="max-width: 200px; min-width: 100px; height: 100px; align-items: center;">
|
|
<div style="width: 60px; height: 60px;"></div>
|
|
</div>
|
|
|
|
<div id="justify_content_overflow_min_max" style="min-height: 100px; max-height: 110px; justify-content: center;">
|
|
<div style="width: 50px; height: 50px;"></div>
|
|
<div style="width: 50px; height: 50px;"></div>
|
|
<div style="width: 50px; height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_max_width" style="width: 200px; height: 100px;">
|
|
<div style="flex-direction: row; max-width: 100px;">
|
|
<div style="height: 20px; flex-grow: 1;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_max_width" style="width: 200px; height: 100px;">
|
|
<div style="flex-direction: row; max-width: 300px;">
|
|
<div style="height: 20px; flex-grow: 1;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_min_row" style="min-width: 100px; height:100px; flex-direction: row;">
|
|
<div style="flex-grow:1;"></div>
|
|
<div style="width: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_min_column" style="min-height: 100px;">
|
|
<div style="flex-grow:1;"></div>
|
|
<div style="height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_max_row" style="width: 200px;">
|
|
<div style="height: 100px; max-width: 100px; flex-direction: row;">
|
|
<div style="flex-shrink:1; flex-basis:100px"></div>
|
|
<div style="width: 50px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_max_column" style="max-height: 100px; width: 100px;">
|
|
<div style="flex-shrink:1; flex-basis:100px"></div>
|
|
<div style="height: 50px;"></div>
|
|
</div>
|