Fix absolute position if align-item or justify-content is center or flex-end
Summary: Fix #310 (```center```) additionally fixes if ```flex-end``` is set. Closes https://github.com/facebook/yoga/pull/349 Reviewed By: dshahidehpour Differential Revision: D4458528 Pulled By: emilsjolander fbshipit-source-id: f073c80bfc3ea6675cb95b00283074d10e91a042
This commit is contained in:
committed by
Facebook Github Bot
parent
2cc2a5f2ff
commit
7c09244c39
@@ -24,3 +24,39 @@
|
||||
<div style="position: absolute; width: 50px; height: 50px; left: 0px; top: 0px;"></div>
|
||||
<div style="position: absolute; width: 50px; height: 50px; right: 0px; bottom: 0px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_and_justify_content_center" style="height: 100px; width: 110px; flex-grow: 1; align-items: center; justify-content: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_and_justify_content_flex_end" style="height: 100px; width: 110px; flex-grow: 1; align-items: flex-end; justify-content: flex-end;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_justify_content_center" style="height: 100px; width: 110px; flex-grow: 1; justify-content: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_center" style="height: 100px; width: 110px; flex-grow: 1; align-items: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_center_on_child_only" style="height: 100px; width: 110px; flex-grow: 1;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;align-self: center;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_and_justify_content_center_and_top_position" style="height: 100px; width: 110px; flex-grow: 1; align-items: center; justify-content: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;top:10px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_and_justify_content_center_and_bottom_position" style="height: 100px; width: 110px; flex-grow: 1; align-items: center; justify-content: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;bottom:10px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_and_justify_content_center_and_left_position" style="height: 100px; width: 110px; flex-grow: 1; align-items: center; justify-content: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;left:5px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="absolute_layout_align_items_and_justify_content_center_and_right_position" style="height: 100px; width: 110px; flex-grow: 1; align-items: center; justify-content: center;">
|
||||
<div style="position: absolute; width: 60px; height: 40px;right:5px;"></div>
|
||||
</div>
|
Reference in New Issue
Block a user