Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Box percentage width calculation is different from the Web #1661

Open
1 task done
zxr0000000 opened this issue Jun 3, 2024 · 0 comments
Open
1 task done

Box percentage width calculation is different from the Web #1661

zxr0000000 opened this issue Jun 3, 2024 · 0 comments

Comments

@zxr0000000
Copy link

zxr0000000 commented Jun 3, 2024

Report

I have read the relevant Yoga documentation, but I am not sure if the following behavior is expected. The context for this issue assumes flexDirection: 'row'.

If everything is working as expected, feel free to close this issue.

Issues and Steps to Reproduce

When setting the width of a parent container to be determined by its content, and the child box's width is specified as a percentage, an issue arises. The behavior of the child container with a percentage width differs between Yoga and standard web behavior.

To reproduce, use the following code in Yoga's playground:

<Layout config={{useWebDefaults: false}}>
  <Node style={{width: 350, height: 350, padding: 20, flexDirection: 'row'}}>
    <Node style={{height: 300, flexDirection: 'row'}}>
      <Node style={{width: 200, height: 200}}></Node>
    </Node>
    <Node style={{height: 300, flexDirection: 'row'}}>
      <Node style={{width: '50%', height: 200}}></Node>
    </Node>
  </Node>
</Layout>
image image

Expected Behavior

I expected the child container with width: '50%' to correctly adapt based on the width of its parent container, as it does in web standards.

Actual Behavior

The parent container's width is calculated based on its content, resulting in incorrect rendering when the child uses a percentage width. This differs from standard web behavior where the parent width would be 0 in such a case.

Please let me know if you need any further information or clarification. Thank you for your

@zxr0000000 zxr0000000 changed the title Box width calculation is different from the Web Box percentage width calculation is different from the Web Jun 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants