Fix issue where we were not centering absolute nodes correctly when justifying (#1489)

Summary:
Pull Request resolved: https://github.com/facebook/yoga/pull/1489

X-link: https://github.com/facebook/react-native/pull/41690

Centering involves centering the margin box in the content box of the parent, and then getting the distance from the flex start edge of the parent to the child

Reviewed By: NickGerleman

Differential Revision: D51383625

fbshipit-source-id: 6bbbace95689ef39c35303bea4b99505952df457
This commit is contained in:
Joe Vilches
2023-12-07 21:25:45 -08:00
committed by Facebook GitHub Bot
parent f8d048bb1a
commit 897f9b7423
5 changed files with 755 additions and 3 deletions

View File

@@ -503,3 +503,29 @@
</div>
</div>
</div>
<div id="static_position_justify_center_amalgamation">
<div style="position: relative; margin: 5px 9px 1px 4px; border-width: 6px 7px 8px 5px; padding: 9px 11px 13px 2px">
<div
style="position: static; margin: 6px 3px 9px 8px; border-width: 10px 2px 1px 8px; padding: 7px 9px 4px 1px; justify-content: center;">
<div
style="position: absolute; width: 21%; margin: 12px 4px 7px 9px; border-width: 1px 5px 9px 2px; padding: 3px 8px 10px 5px">
<div
style="width: 100px; height: 50px; position: relative; margin: 12px 4px 7px 9px; border-width: 1px 5px 9px 2px; padding: 3px 8px 10px 5px">
</div>
</div>
<div
style="position: relative; width: 10%; margin: 12px 4px 7px 9px; border-width: 1px 5px 9px 2px; padding: 3px 8px 10px 5px">
<div
style="width: 100px; height: 50px; position: relative; margin: 12px 4px 7px 9px; border-width: 1px 5px 9px 2px; padding: 3px 8px 10px 5px">
</div>
</div>
<div
style="position: relative; width: 10%; margin: 12px 4px 7px 9px; border-width: 1px 5px 9px 2px; padding: 3px 8px 10px 5px">
<div
style="width: 100px; height: 50px; position: relative; margin: 12px 4px 7px 9px; border-width: 1px 5px 9px 2px; padding: 3px 8px 10px 5px">
</div>
</div>
</div>
</div>
</div>