How to simulate "align-items: baseline" in React Native?

Viewed 11087

Since there is no "align-items: baseline" in RN's implementation of Flexbox, how can I align the baselines of two text element horizontally?

enter image description here

The JSX:

<View style={styles.numberAndPercent}>
  <Text style={styles.number}>6.80</Text>
  <Text style={styles.percent}>%</Text>
</View>
5 Answers

Try this

{
    fontSize: 40,
    lineHeight: 40 * 0.75,
    paddingTop: 40 - (35 * 0.75), // <-- Add this
}
Related