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

Web Inconsistency: Node has wrong height and text is clipped #504

Closed
rigdern opened this issue Apr 12, 2017 · 2 comments
Closed

Web Inconsistency: Node has wrong height and text is clipped #504

rigdern opened this issue Apr 12, 2017 · 2 comments

Comments

@rigdern
Copy link

rigdern commented Apr 12, 2017

Bug expressed using React Native components:

<View style={{"position":"absolute","left":0,"right":0,"alignItems":"flex-start","height":375,"marginTop":20}}>
  <View style={{"overflow":"hidden","justifyContent":"flex-end","height":99}}>
    <View>
      <View style={{"flexGrow":1,"flexShrink":1,"flexDirection":"row","backgroundColor":"steelblue"}}>
        <View>
          <Text>Line One</Text>
          <Text style={{"flexGrow":1,"flexShrink":1}}>Line Two</Text>
        </View>
      </View>
    </View>
    <View style={{"height":22,"width":22,"backgroundColor":"orange"}} />
  </View>
</View>

Expected result

Both lines are visible and the blue box is just tall enough to fit the text (JSFiddle: https://jsfiddle.net/w71q2oc6/1/). This is how it lays out on web and in the version of Yoga that shipped with React Native 0.34.0-rc.0.

image

Actual result

First line is clipped and the blue box is too tall.

image

@lucdion
Copy link
Contributor

lucdion commented Jul 25, 2017

@rigdern does this PR (#506) fixed your problem?

@woehrl01
Copy link
Contributor

Refixed in #635. If not, please reopen.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants